:root {
  --ink:#1d2227;
  --muted:#687078;
  --line:#e8e0d8;
  --paper:#fffdf9;
  --warm:#fff8f1;
  --coral:#ff5c55;
  --coral-dark:#c8433d;
  --green:#28ad72;
  --blue:#2f70ed;
  --shadow:0 18px 55px rgba(39,45,51,.09);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; }
main { overflow:hidden; }
.tips-hero { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(340px,.7fr); gap:70px; align-items:center; max-width:1470px; min-height:650px; margin:auto; padding:90px 34px; }
.eyebrow,.section-heading > span,.section-heading > div > span,.special-copy > span,.calm-section > div > span,.final-cta > span,.season-card span { display:inline-flex; color:var(--coral-dark); font-size:.69rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.hero-copy h1 { max-width:900px; margin:18px 0 22px; font-size:clamp(3.25rem,6.4vw,6.5rem); line-height:.91; letter-spacing:-.075em; }
.hero-copy h1 em { color:var(--coral); font-style:normal; }
.hero-copy > p { max-width:760px; margin:0; color:var(--muted); font-size:1.08rem; line-height:1.7; }
.hero-actions { display:flex; gap:12px; margin-top:30px; }
.hero-actions a,.final-cta > a { display:inline-grid; place-items:center; min-height:54px; padding:0 25px; border-radius:14px; font-size:.83rem; font-weight:900; text-decoration:none; }
.hero-actions .primary,.final-cta > a { background:var(--coral); color:#fff; box-shadow:0 12px 25px rgba(255,92,85,.19); }
.hero-actions .secondary { border:1px solid var(--line); background:#fff; }
.hero-card { padding:34px; border:1px solid #eee3da; border-radius:28px; background:#fff; box-shadow:var(--shadow); }
.hero-card-icon,.season-icon { display:grid; place-items:center; width:58px; height:58px; border-radius:17px; background:#fff0ed; }
.hero-card-icon svg,.season-icon svg { width:27px; fill:none; stroke:var(--coral); stroke-linecap:round; stroke-linejoin:round; stroke-width:1.8; }
.hero-card > span { display:block; margin-top:25px; color:#898079; font-size:.66rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.hero-card h2 { margin:8px 0 10px; font-size:2rem; letter-spacing:-.04em; }
.hero-card p { margin:0; color:var(--muted); line-height:1.6; }
.hero-card ul,.access-check ul { display:grid; gap:11px; margin:22px 0 0; padding:20px 0 0; border-top:1px solid var(--line); list-style:none; }
.hero-card li,.access-check li { position:relative; padding-left:25px; color:#4d555c; font-size:.8rem; font-weight:720; line-height:1.4; }
.hero-card li::before,.access-check li::before { content:"✓"; position:absolute; left:0; color:var(--green); font-weight:950; }
.jump-nav { display:flex; gap:8px; justify-content:center; max-width:1240px; margin:0 auto 52px; padding:0 24px; overflow-x:auto; }
.jump-nav a { flex:0 0 auto; padding:10px 16px; border:1px solid #eadfd6; border-radius:999px; background:#fff; color:#5f666c; font-size:.69rem; font-weight:850; text-decoration:none; }
.season-card { display:grid; grid-template-columns:auto 1fr; gap:22px; align-items:center; max-width:1240px; margin:0 auto 110px; padding:27px 31px; border:1px solid #ffd4cf; border-radius:23px; background:#fff5f2; }
.season-card h2 { margin:5px 0 7px; font-size:1.45rem; letter-spacing:-.035em; }
.season-card p { margin:0; color:#695f5b; font-size:.85rem; line-height:1.6; }
.content-section,.roles-section { max-width:1240px; margin:0 auto; padding:0 24px 120px; scroll-margin-top:115px; }
.section-heading { max-width:720px; margin-bottom:34px; }
.section-heading h2,.special-copy h2,.calm-section h2,.final-cta h2 { margin:8px 0 10px; font-size:clamp(2rem,4vw,3.5rem); line-height:1.02; letter-spacing:-.055em; }
.section-heading p,.split-heading > p { margin:0; color:var(--muted); line-height:1.65; }
.split-heading { display:grid; grid-template-columns:1fr minmax(300px,.65fr); gap:55px; align-items:end; max-width:none; }
.timeline { position:relative; display:grid; gap:0; margin:0; padding:0; list-style:none; }
.timeline::before { content:""; position:absolute; top:27px; bottom:27px; left:216px; width:2px; background:#e8e0d8; }
.timeline li { position:relative; display:grid; grid-template-columns:190px 1fr; gap:62px; min-height:122px; padding:22px 0; }
.timeline li::before { content:""; position:absolute; top:30px; left:209px; width:12px; height:12px; border:5px solid var(--paper); border-radius:50%; background:var(--coral); box-shadow:0 0 0 1px #f3b8b2; }
.timeline-when { color:var(--coral-dark); font-size:.75rem; font-weight:900; text-align:right; }
.timeline h3 { margin:0 0 7px; font-size:1.1rem; }
.timeline p { margin:0; color:var(--muted); font-size:.82rem; line-height:1.6; }
.tip-grid,.supplier-grid,.role-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }
.tip-card,.supplier-grid article,.role-grid article { min-height:220px; padding:25px; border:1px solid #ebe3dc; border-radius:20px; background:#fff; }
.tip-number,.role-grid article > span { color:var(--coral); font-size:.66rem; font-weight:950; letter-spacing:.08em; }
.tip-card h3,.supplier-grid h3,.role-grid h3 { margin:29px 0 9px; font-size:1.03rem; }
.tip-card p,.supplier-grid p,.role-grid p { margin:0; color:var(--muted); font-size:.78rem; line-height:1.6; }
.special-section { display:grid; grid-template-columns:1.15fr .85fr; gap:55px; max-width:1240px; margin:0 auto 120px; padding:50px; border-radius:30px; background:#1e252b; color:#fff; scroll-margin-top:115px; }
.special-copy > span { color:#ff938d; }
.special-copy p { max-width:680px; color:#c6cbd0; line-height:1.65; }
.special-list { display:flex; flex-wrap:wrap; gap:8px; margin-top:25px; }
.special-list span { padding:8px 12px; border:1px solid #475159; border-radius:999px; color:#e4e7e9; font-size:.67rem; font-weight:760; }
.access-check { align-self:center; padding:27px; border:1px solid #3c474f; border-radius:21px; background:#293138; }
.access-check h3 { margin:0; }
.access-check ul { border-color:#434d55; }
.access-check li { color:#d6dadd; }
.supplier-grid { grid-template-columns:repeat(4,1fr); }
.supplier-grid article { min-height:245px; }
.supplier-grid h3 { margin-top:22px; }
.mini-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; background:#eef4ff; color:#2b68d2; font-weight:950; }
.quote-reminder { display:flex; gap:10px; margin-top:15px; padding:17px 20px; border:1px solid #cfe7da; border-radius:15px; background:#f1faf5; color:#4d6258; font-size:.77rem; line-height:1.5; }
.quote-reminder strong { flex:0 0 auto; color:#24744f; }
.help-section { padding-top:10px; }
.help-grid { display:grid; grid-template-columns:1.3fr .7fr; gap:35px; align-items:start; }
.help-grid > p { margin:0; color:#555e65; font-size:1rem; line-height:1.75; }
.help-note { display:grid; gap:6px; padding:21px; border:1px solid #e5dcd4; border-radius:17px; background:#fffaf4; }
.help-note span { color:var(--muted); font-size:.78rem; line-height:1.55; }
.roles-section { padding-top:55px; padding-bottom:120px; }
.role-grid article { min-height:205px; }
.role-grid h3 { margin-top:26px; }
.responsibility-strip { display:grid; grid-template-columns:repeat(4,1fr); margin-top:18px; overflow:hidden; border:1px solid #dce6f2; border-radius:17px; background:#f5f8fd; }
.responsibility-strip div { display:grid; gap:3px; padding:16px 18px; border-right:1px solid #dce6f2; }
.responsibility-strip div:last-child { border:0; }
.responsibility-strip strong { color:#2764ca; font-size:.72rem; }
.responsibility-strip span { color:#69737c; font-size:.67rem; }
.checklist-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.checklist-grid label { display:flex; align-items:center; gap:13px; min-height:63px; padding:12px 17px; border:1px solid #e8e1da; border-radius:14px; background:#fff; color:#4f575e; font-size:.78rem; font-weight:720; }
.checklist-grid label span { display:grid; place-items:center; width:29px; height:29px; flex:0 0 auto; border-radius:50%; background:#eaf8f1; color:var(--green); font-weight:950; }
.calm-section { display:grid; grid-template-columns:1.1fr .9fr; gap:70px; max-width:1240px; margin:0 auto 120px; padding:55px; border-radius:30px; background:#fff3ef; scroll-margin-top:115px; }
.calm-section p { color:#6e625e; line-height:1.7; }
.calm-section ul { display:grid; gap:10px; align-content:center; margin:0; padding:0; list-style:none; }
.calm-section li { display:grid; gap:3px; padding:16px 18px; border:1px solid #f2d4ce; border-radius:14px; background:rgba(255,255,255,.58); }
.calm-section li strong { color:#b6433d; font-size:.78rem; }
.calm-section li span { color:#716864; font-size:.72rem; line-height:1.45; }
.final-cta { max-width:1240px; margin:0 auto 100px; padding:75px 40px; border-radius:30px; background:#f4f7fb; text-align:center; }
.final-cta h2 { max-width:820px; margin:9px auto 12px; }
.final-cta p { max-width:660px; margin:0 auto 25px; color:var(--muted); line-height:1.6; }
footer { display:flex; align-items:center; gap:24px; min-height:120px; padding:25px max(28px,calc((100vw - 1240px)/2)); border-top:1px solid #e9e1da; }
.footer-brand { font-size:1rem; }
footer p { flex:1; color:#7b8288; font-size:.7rem; }
footer > a:last-child { color:#505960; font-size:.71rem; font-weight:800; }

@media(max-width:1100px) {
.site-header nav { display:none; }
.tips-hero { grid-template-columns:1fr; gap:38px; }
  .hero-card { max-width:680px; }
  .supplier-grid { grid-template-columns:1fr 1fr; }
}

@media(max-width:760px) {
.brand { font-size:1.08rem; }
.sign-in { display:none !important; }
.tips-hero { min-height:auto; padding:60px 20px; }
  .hero-copy h1 { font-size:clamp(3rem,15vw,4.7rem); }
  .hero-copy > p { font-size:.92rem; }
  .hero-actions { display:grid; }
  .hero-card { padding:25px; }
  .jump-nav { justify-content:flex-start; margin-bottom:36px; }
  .season-card { grid-template-columns:1fr; margin:0 16px 80px; padding:23px; }
  .content-section,.roles-section { padding:0 16px 85px; }
  .split-heading { grid-template-columns:1fr; gap:12px; }
  .timeline::before { left:13px; }
  .timeline li { grid-template-columns:1fr; gap:8px; padding:18px 0 18px 45px; }
  .timeline li::before { top:22px; left:6px; }
  .timeline-when { text-align:left; }
  .tip-grid,.supplier-grid,.role-grid { grid-template-columns:1fr; }
  .tip-card,.supplier-grid article,.role-grid article { min-height:0; }
  .special-section { grid-template-columns:1fr; gap:25px; margin:0 16px 85px; padding:30px 22px; }
  .help-grid,.calm-section { grid-template-columns:1fr; gap:24px; }
  .responsibility-strip { grid-template-columns:1fr 1fr; }
  .responsibility-strip div:nth-child(2) { border-right:0; }
  .responsibility-strip div:nth-child(-n+2) { border-bottom:1px solid #dce6f2; }
  .checklist-grid { grid-template-columns:1fr; }
  .calm-section { margin:0 16px 85px; padding:30px 23px; }
  .final-cta { margin:0 16px 70px; padding:48px 22px; }
  footer { align-items:flex-start; flex-wrap:wrap; padding:28px 18px; }
  footer p { flex-basis:100%; order:3; margin:0; }
}