/* === Base (from Bespoke) === */

:root{
      --maxw:1140px;
      --pad: min(4vw, 32px);
      --gap: clamp(20px, 4vw, 48px);
      --lead: clamp(18px, 2.2vw, 22px);
      --cta_lead: clamp(18px, 2.2vw, 22px);
      --heading: clamp(34px, 6vw, 64px);
      --h2: clamp(28px, 4vw, 44px);
      --h3: clamp(20px, 2.6vw, 26px);
      --muted:#6f7378;
      --ink:#111318;
      --paper:#ffffff;
      --soft:#f6f7f8;
      --brand:#111318;
      --radius:20px;
      --shadow: 0 10px 30px rgba(0,0,0,.06);
    }

    html,body{margin:0;padding:0;background:var(--paper);color:var(--ink)}
    body{font-family:"PT Serif", Georgia, serif; line-height:1.5}

    /* Header */
    .header{
      position:sticky;
      top:0;
      z-index:50;
      background:#fff; /* Şeffaf yerine opak beyaz */
      border-bottom:1px solid #eee; /* İnce gri çizgi */
    }
    .header .inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px var(--pad)}
    .logo-icon{height:42px;width:auto;display:block}
    .nav a{
      color:var(--ink);
      text-decoration:none;
      margin:0 10px;
      font-weight:400;      /* 600 -> 400 */
      font-size:16px;       /* 14px -> 16px */
      letter-spacing:.02em;
    }
    .nav a.btn{padding:10px 16px;border:1px solid #ddd;border-radius:999px}

    /* ---- Body: Embark tarzı ---- */

    .hero{
      position:relative; min-height:76vh; display:grid; place-items:end start; overflow:hidden;
      background:#000;
    }
    .hero .media{
      position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:brightness(.72) contrast(1.05);
    }
    .hero .container{
      position:relative; z-index:1; padding: clamp(40px, 8vw, 100px) var(--pad);
      width: min(var(--maxw), 100%); color:#fff;
    }
    .kicker{
      letter-spacing:.2em; text-transform:uppercase; font-size:12px; font-weight:700; opacity:.9
    }
    .hero h1{
      font-family: "PT Serif", Georgia, serif; font-size: var(--heading); line-height:1.05; margin:.6rem 0 1rem;
    }
    .lead{
      font-size: var(--lead); max-width: 60ch; opacity:.95;
    }
    .cta-row{display:flex; gap:12px; margin-top:24px; flex-wrap:wrap}
    .btn{
      appearance:none; border:1px solid rgba(255,255,255,.5); background:rgba(255,255,255,.1); color:#fff;
      padding:12px 18px; border-radius:999px; font-weight:600; cursor:pointer; text-decoration:none; display:inline-block;
    }
    .btn:hover{background:rgba(255,255,255,.18)}
    .btn.dark{border-color:#ddd; background:#111318; color:#fff}
    .btn.light{border-color:#ddd; background:#fff; color:#111318}

    /* Manifesto blokları */
    .block{
      padding: clamp(56px, 8vw, 110px) var(--pad);
      display:grid; place-items:center;
      background: var(--paper);
    }
    .block .inner{width:min(var(--maxw),100%); text-align:center}
    .block h2{
      font-family:"PT Serif", Georgia, serif; font-size:var(--h2); line-height:1.1; margin:0 0 12px
    }
    .block h2 .dot{color:var(--ink)}
    .block p{max-width: 72ch; margin:0 auto; color:var(--muted); font-size: var(--lead)}

    /* Tam genişlik görsel kırıcı */
    .breaker{
      height: clamp(320px, 56vh, 560px); position:relative; overflow:hidden;
      background:#000;
    }
    .breaker img{width:100%; height:100%; object-fit:cover; filter:brightness(.78) contrast(1.05)}

    /* Üçlü kompakt grid */
    .cards{
      padding: clamp(50px, 7vw, 96px) var(--pad);
      background: var(--soft);
    }
    .cards .inner{width:min(var(--maxw),100%); margin:0 auto}
    .cards h2{font-family:"PT Serif", Georgia, serif; font-size:var(--h2); text-align:center; margin:0 0 28px}
    .grid3{
      display:grid; gap:var(--gap);
      grid-template-columns: repeat(3, minmax(0,1fr));
    }
    @media (max-width:900px){ .grid3{grid-template-columns:1fr} }

    .card{
      background:#fff; border-radius:var(--radius); padding:24px; box-shadow: var(--shadow);
      display:grid; gap:10px; align-content:start; min-height:160px;
    }
    .card h3{font-size:var(--h3); margin:0}
    .card p{color:var(--muted); margin:0}

    /* Süreç */
    .process{
      padding: clamp(56px, 7vw, 96px) var(--pad); background:#fff;
    }
    .process .inner{width:min(var(--maxw),100%); margin:0 auto}
    .steps{
      display:grid; gap:var(--gap);
      grid-template-columns: repeat(4, minmax(0,1fr));
      border:1px solid #eee; border-radius:var(--radius); padding: clamp(12px, 2vw, 18px);
    }
    @media (max-width:1000px){ .steps{grid-template-columns:1fr 1fr} }
    @media (max-width:640px){ .steps{grid-template-columns:1fr} }

    .step{
      background:var(--soft); border-radius:14px; padding:18px 16px;
      display:grid; gap:8px; align-content:start;
    }
    .step .n{font-weight:700; letter-spacing:.18em; font-size:12px; text-transform:uppercase; color:#555}
    .step h4{margin:0; font-size:18px}
    .step p{margin:0; color:var(--muted)}

    /* CTA form */
    .cta{
      padding: clamp(56px, 8vw, 110px) var(--pad); background:#fff;
    }
    .cta .inner{width:min(860px,100%); margin:0 auto; text-align:center}

    /* YENİ: CTA metni — manifesto paragraflarıyla aynı boy ve ortalı */
    .cta-lead{
      font-size: var(--lead);
      max-width:60ch;
      margin-inline:auto;
      text-align:center;
      color:var(--muted);
      display:block;
    }

    .form{
      margin-top:18px; text-align:left; background:#fff; border:1px solid #eee; border-radius:var(--radius); padding:22px; box-shadow: var(--shadow);
      display:grid; gap:14px; grid-template-columns:1fr 1fr;
    }
    .form input, .form textarea{
      width:100%; padding:12px 14px; border:1px solid #e2e5e8; border-radius:12px; font: inherit;
      background:#fff;
    }
    .form textarea{grid-column:1/-1; min-height:140px}
    @media (max-width:720px){ .form{grid-template-columns:1fr} }

    /* Util */
    .center{ text-align:center }
    .spacer{ height: clamp(40px, 7vh, 80px) }

    /* Footer — index ile aynı boy */
    .footer small{ font-size:14px; font-weight:400; line-height:1.6 }

/* === Celebrations additions === */

.card .thumb{
      width:100%;
      aspect-ratio: 16 / 10;    /* Tek tip oran */
      object-fit: cover;        /* Taşmadan kırp */
      border-radius:12px;
      display:block;
    }

/* === Transportation page scoped overrides === */
body.transportation{
  --maxw:1280px;
  --gap: clamp(18px, 3.6vw, 40px);
  --lead: clamp(18px, 2.2vw, 22px);
  --cta_lead: clamp(18px, 2.2vw, 22px);
  --heading: clamp(34px, 6vw, 64px);
  --h2: clamp(28px, 4vw, 44px);
  --h3: clamp(20px, 2.6vw, 26px);
  --muted:#6f7378;
  --ink:#111318;
  --paper:#ffffff;
  --soft:#f6f7f8;
  --radius:20px;
  --shadow: 0 10px 30px rgba(0,0,0,.06);
  --img-ratio: 16/10;
  --img-h: clamp(200px, 24vw, 280px);
}

body.transportation .cards{ padding: clamp(44px, 6.2vw, 80px) var(--pad) clamp(36px, 5vw, 64px); background: var(--soft); }
body.transportation .grid4{
  display:grid; gap:var(--gap);
  grid-template-columns: repeat(2, minmax(0,1fr));
}
@media (max-width:640px){
  body.transportation .grid4{ grid-template-columns:1fr }
}
body.transportation .card{
  background:#fff; border-radius:var(--radius); box-shadow: var(--shadow);
  display:grid; align-content:start; overflow:hidden; padding:0;
}
body.transportation .card .img-wrap{ width:100%; height:var(--img-h); aspect-ratio: var(--img-ratio); overflow:hidden; }
body.transportation .card .img-wrap img{ width:100%; height:100%; object-fit:cover; display:block; transform: translateZ(0); }
body.transportation .card .body{ padding:18px 20px 16px; display:grid; gap:8px }
body.transportation .card h3{ font-size:var(--h3); margin:0 }
body.transportation .card p{ color:var(--muted); margin:0; line-height:1.5; font-size: clamp(16px, 1.5vw, 18px); }

body.transportation .process{ padding: clamp(50px, 6.4vw, 84px) var(--pad); background:#fff; }
body.transportation .cta{ padding: clamp(50px, 7vw, 90px) var(--pad); background:#fff; }
body.transportation .spacer{height: clamp(36px, 6vh, 72px)}