/* FestiTale Timeline 1.8.0 – isolated ft180 namespace. */
.ft180-timeline-page{
  --ft180-navy:#071d2c;
  --ft180-mint:#74cbb0;
  --ft180-coral:#f26f5b;
  --ft180-gold:#e8b55a;
  --ft180-paper:#f7f2e8;
  --ft180-card:#fffdf8;
  --ft180-ink:#12344c;
  --ft180-muted:#58707b;
  --ft180-line:#d7d3ca;
  width:min(1280px,calc(100% - 40px));
  margin:0 auto;
  padding:28px 0 78px;
  color:var(--ft180-ink);
}
.ft180-timeline-page *{box-sizing:border-box}
.ft180-timeline-page .eyebrow{margin:0 0 13px;color:#3e9c86;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}

.ft180-timeline-hero{overflow:hidden;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);align-items:stretch;min-height:530px;border-radius:30px;background:var(--ft180-navy);color:#fff}
.ft180-timeline-hero-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(44px,5.5vw,76px)}
.ft180-timeline-hero .eyebrow{color:var(--ft180-mint)}
.ft180-timeline-hero h1{max-width:720px;margin:0;font:520 clamp(48px,5.4vw,76px)/.98 FestiTaleSerif,Newsreader,Georgia,serif;letter-spacing:-.042em;text-wrap:balance}
.ft180-timeline-hero h1 span{display:block}
.ft180-lead{max-width:680px;margin:28px 0 0;color:#d2e0e5;font-size:18px;line-height:1.62}
.ft180-focus{max-width:650px;margin:34px 0 0;padding:3px 0 3px 20px;border-left:4px solid var(--ft180-coral);color:#fff;font-size:15px;font-weight:750;line-height:1.55}
.ft180-timeline-visual{position:relative;min-height:530px;margin:0;background:#0c2639}
.ft180-timeline-visual img{width:100%;height:100%;display:block;object-fit:cover}
.ft180-timeline-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(7,29,44,.72))}
.ft180-timeline-visual figcaption{position:absolute;z-index:1;right:24px;bottom:22px;left:24px;color:#fff;font-size:12px;font-weight:800;letter-spacing:.04em;text-align:right}

.ft180-explain{margin-top:24px;padding:34px 38px;display:grid;grid-template-columns:minmax(300px,.9fr) minmax(0,1.1fr);gap:54px;align-items:center;border:1px solid var(--ft180-line);border-radius:24px;background:var(--ft180-card);box-shadow:0 9px 28px rgba(7,29,44,.04)}
.ft180-explain h2{margin:0;font:550 clamp(31px,3.2vw,44px)/1.03 FestiTaleSerif,Newsreader,Georgia,serif}
.ft180-explain>p{max-width:650px;margin:0;color:var(--ft180-muted);font-size:16px;line-height:1.65}

.ft180-timeline{padding:74px 0 0}
.ft180-section-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:48px;align-items:end;margin-bottom:32px}
.ft180-section-head h2{margin:0;font:530 clamp(42px,5vw,64px)/.98 FestiTaleSerif,Newsreader,Georgia,serif;letter-spacing:-.035em}
.ft180-section-head p{margin:0;color:var(--ft180-muted);font-size:15px;line-height:1.6;text-align:right}
.ft180-timeline-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.ft180-event{position:relative;min-height:300px;padding:26px 28px 24px;display:flex;flex-direction:column;border:1px solid var(--ft180-line);border-radius:22px;background:var(--ft180-card);box-shadow:0 9px 28px rgba(7,29,44,.045)}
.ft180-event:before{content:"";position:absolute;top:0;right:28px;left:28px;height:4px;border-radius:0 0 4px 4px;background:var(--ft180-mint)}
.ft180-event--test:before{background:var(--ft180-coral)}
.ft180-event--improved:before{background:var(--ft180-gold)}
.ft180-event>header{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:24px}
.ft180-event time{color:var(--ft180-muted);font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
.ft180-event>header span{padding:7px 12px;border-radius:999px;background:rgba(116,203,176,.18);color:#27735f;font-size:10px;font-weight:900;letter-spacing:.06em}
.ft180-event--test>header span{background:rgba(242,111,91,.13);color:#a3493d}
.ft180-event--improved>header span{background:rgba(232,181,90,.2);color:#866219}
.ft180-event h3{margin:0;font:550 clamp(25px,2.5vw,32px)/1.05 FestiTaleSerif,Newsreader,Georgia,serif}
.ft180-event>p{margin:16px 0 24px;color:var(--ft180-muted);font-size:14px;line-height:1.62}
.ft180-event-next{min-width:0;min-height:0;margin-top:auto;padding:17px 0 0;display:flex;align-items:flex-start;gap:9px;border-top:1px solid #e5e1d9;background:transparent;color:var(--ft180-ink);font-size:12px;font-weight:780;line-height:1.5}
.ft180-event-next strong{flex:0 0 auto;color:var(--ft180-coral)}

.ft180-next{margin-top:28px;padding:38px 42px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:38px;align-items:center;border-radius:26px;background:var(--ft180-navy);color:#fff}
.ft180-next h2{margin:0;font:520 clamp(31px,3.7vw,48px)/1 FestiTaleSerif,Newsreader,Georgia,serif}
.ft180-next p{max-width:720px;margin:12px 0 0;color:#d2e0e5;font-size:14px;line-height:1.6}
.ft180-next .primary-button{border:0;white-space:nowrap;cursor:pointer}

@media(max-width:920px){
  .ft180-timeline-hero{grid-template-columns:1fr}
  .ft180-timeline-visual{min-height:420px}
  .ft180-explain,.ft180-section-head{grid-template-columns:1fr;gap:14px}
  .ft180-section-head p{text-align:left}
}
@media(max-width:700px){
  .ft180-timeline-page{width:calc(100% - 24px);padding:18px 0 62px}
  .ft180-timeline-hero{min-height:0;border-radius:22px}
  .ft180-timeline-hero-copy{padding:34px 22px 30px}
  .ft180-timeline-hero h1{font-size:clamp(34px,10.4vw,43px);line-height:1.02;letter-spacing:-.035em}
  .ft180-lead{margin-top:22px;font-size:15px;line-height:1.55}
  .ft180-focus{margin-top:26px;padding-left:14px;font-size:13px;line-height:1.48}
  .ft180-timeline-visual{min-height:0;aspect-ratio:4/3}
  .ft180-timeline-visual figcaption{right:16px;bottom:14px;left:16px;font-size:10px}
  .ft180-explain{margin-top:12px;padding:26px 22px;border-radius:20px}
  .ft180-explain h2{font-size:30px}
  .ft180-explain>p{font-size:13px}
  .ft180-timeline{padding-top:48px}
  .ft180-section-head{margin-bottom:24px}
  .ft180-section-head h2{font-size:42px}
  .ft180-section-head p{font-size:13px}
  .ft180-timeline-grid{grid-template-columns:1fr;gap:14px}
  .ft180-event{min-height:0;padding:23px 20px 20px;border-radius:19px}
  .ft180-event:before{right:20px;left:20px}
  .ft180-event>header{margin-bottom:19px}
  .ft180-event h3{font-size:26px}
  .ft180-event>p{font-size:13px}
  .ft180-next{grid-template-columns:1fr;margin-top:16px;padding:28px 22px;border-radius:21px}
  .ft180-next .primary-button{width:100%;justify-content:space-between}
}
@media(max-width:390px){
  .ft180-timeline-hero h1{font-size:33px}
  .ft180-event>header{align-items:flex-start;flex-direction:column;gap:9px}
}
@media(prefers-reduced-motion:reduce){.ft180-timeline-page *{scroll-behavior:auto!important}}
