/* İletişim sayfası (4 Kas 2026) — tasarım: gorseller-3kas/İletişim/P360 Health Contact Page Mockup.png
   Ölçüler 1672 px tasarım pikseli (--u). Form alanlarının kimlikleri js/contact-final.js ile aynı kalmalı. */

.i-sayfa{background:#fff;overflow:hidden}
.i-sayfa h1,.i-sayfa h2,.i-sayfa h3{color:var(--a-lacivert);font-weight:800;letter-spacing:-.04em;margin:0}
.i-sayfa .s-koyu h2{color:#fff}
.i-sayfa h1 em,.i-sayfa h2 em{display:block;font-style:normal;color:var(--a-turuncu)}
.i-alt{font-size:16px;line-height:1.55;color:var(--a-gri);margin:10px 0 0}

/* ── Açılış: görsel + üstüne oturan "Strateji Görüşmesi" rozeti ── */
.i-gorsel-kap{position:relative}
.i-gorsel-kap:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#fff 0,rgba(255,255,255,0) 22%)}
.i-gorsel{display:block;width:100%;height:auto;max-width:none;aspect-ratio:16/10;object-fit:cover;object-position:25% center}
.i-rozet{position:absolute;z-index:2;right:12px;bottom:12px;display:flex;align-items:center;gap:12px;padding:10px 16px 10px 10px;background:#fff;border-radius:14px;box-shadow:0 12px 30px #14234426}
.i-rozet span{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:50%;background:#fff0e8;color:var(--a-turuncu)}
.i-rozet span svg{width:22px;height:22px}
.i-rozet b{display:block;font:800 15px/1.2 Manrope,sans-serif;color:var(--a-lacivert);letter-spacing:-.02em}
.i-rozet small{display:block;font-size:12.5px;color:#46536b;margin-top:2px}

/* ── Form + süreç ── */
.i-form-bolum{background:#fbfcfe;padding:40px 0 30px}
.i-izgara{display:grid;gap:44px}
.i-form-kart{background:#fff;border:1px solid #eef1f6;border-radius:20px;box-shadow:0 20px 50px #1423440f;padding:26px 20px 24px}
.i-form-kart h2{font-size:clamp(25px,6.4vw,32px);line-height:1.15}
.i-alanlar{display:grid;grid-template-columns:1fr;gap:12px;margin-top:22px}
.i-alan{position:relative}
.i-alan>svg{position:absolute;left:16px;top:50%;width:20px;height:20px;margin-top:-10px;color:#3b4862;stroke-width:1.8;pointer-events:none;z-index:1}
.i-mesaj>svg{top:16px;margin-top:0}
.i-alan .form-control,.i-alan .form-select{height:54px;padding:0 16px 0 48px;border:1.5px solid #dfe5ee;border-radius:12px;font-size:15.5px;color:var(--a-lacivert);background-color:#fff;box-shadow:none}
.i-alan .form-select{padding-right:44px;color:#3b4862;background-position:right 18px center}
.i-alan textarea.form-control{height:auto;min-height:110px;padding-top:14px;resize:vertical}
.i-alan .form-control::placeholder{color:#3b4862;opacity:1}
.i-alan .form-control:focus,.i-alan .form-select:focus{border-color:#f7a388;box-shadow:0 0 0 3px #f4582a22}
.i-onay{display:flex;align-items:flex-start;gap:12px;margin-top:18px;font-size:13.5px;line-height:1.5;color:#3b4862}
.i-onay .form-check-input{flex:none;width:22px;height:22px;margin:0;border:1.5px solid #cfd7e3;border-radius:6px}
.i-onay .form-check-input:checked{background-color:var(--a-turuncu);border-color:var(--a-turuncu)}
.i-onay a{color:var(--a-mavi);text-decoration:underline}
.i-gonder{width:100%;margin-top:18px;padding:18px;border:0;border-radius:10px}
.i-not{font-size:12.5px;color:#7a869b;margin:10px 0 0;text-align:center}

.i-surec h2{font-size:clamp(30px,7.5vw,40px);line-height:1.1}
.i-adimlar{position:relative;list-style:none;margin:28px 0 0;padding:0 0 0 30px;display:grid;gap:26px}
.i-adimlar:before{content:"";position:absolute;left:5px;top:30px;bottom:30px;width:2px;background:#d9e5fb}
.i-adimlar li{position:relative;display:flex;align-items:flex-start;gap:18px}
.i-adimlar li:before{content:"";position:absolute;left:-30px;top:25px;width:12px;height:12px;border-radius:50%;background:var(--a-mavi);box-shadow:0 0 0 4px #e3edfd}
.i-adim-ikon{display:grid;place-items:center;flex:none;width:64px;height:64px;border-radius:16px;background:var(--z);color:var(--r);box-shadow:0 10px 24px #1423441a}
.i-adim-ikon svg{width:30px;height:30px;stroke-width:1.9}
.i-adimlar .mor{--r:#7b4fe0;--z:#ece2fd}
.i-adimlar .turuncu{--z:#feeadf}
.i-adimlar h3{display:flex;align-items:baseline;gap:12px;font-size:21px;letter-spacing:-.03em}
.i-adimlar h3 b{font:800 21px/1 Manrope,sans-serif;color:var(--a-turuncu)}
.i-adimlar p{font-size:15px;line-height:1.55;color:var(--a-gri);margin:8px 0 0}

/* ── Bize ulaşın ── */
.i-ulasin{background:#f8fbfe;padding:46px 0 50px}
.i-ulasin-izgara{display:grid;gap:30px}
.i-ulasin h2{font-size:clamp(30px,7.5vw,40px);line-height:1.1}
.i-bilgi{display:flex;align-items:center;gap:18px;margin-top:12px;padding:16px 18px;background:#fff;border-radius:16px;box-shadow:0 14px 36px #1423440f;border:1px solid #eef1f6}
.i-ulasin .i-alt+.i-bilgi{margin-top:24px}
.i-bilgi>span{display:grid;place-items:center;flex:none;width:54px;height:54px;border-radius:14px;background:#e2eeff;color:var(--a-mavi)}
.i-bilgi>span svg{width:26px;height:26px}
.i-bilgi b{display:block;font:800 14.5px/1.3 Manrope,sans-serif;color:var(--a-lacivert);letter-spacing:-.01em}
.i-bilgi a{display:block;font:800 17px/1.3 Manrope,sans-serif;color:var(--a-lacivert);letter-spacing:-.02em;word-break:break-word;margin-top:3px}
.i-bilgi address{margin:4px 0 0;font-size:15px;line-height:1.45;color:#33405a}
.i-harita{position:relative;border-radius:20px;overflow:hidden;border:1px solid #e3e8ef;aspect-ratio:958/523;background:#eef0f2}
.i-harita-svg{display:block;width:100%;height:100%}
.i-yol{position:absolute;right:12px;bottom:12px;display:inline-flex;align-items:center;gap:10px;padding:12px 16px;background:#fff;border-radius:12px;box-shadow:0 10px 26px #14234426;font:700 15px/1 'DM Sans',sans-serif;color:var(--a-lacivert)}
.i-yol:hover{color:var(--a-turuncu)}
.i-yol svg{width:18px;height:18px}
.i-yol svg:first-child{color:var(--a-turuncu);stroke-width:2.2}

/* ── Kapanış ── */
.i-cta h2{font-size:clamp(28px,7vw,38px);line-height:1.15}

@media (max-width:991.98px){
  .i-hero{display:flex;flex-direction:column}
  .i-hero .s-ic{padding-top:28px}
  .i-cta .s-gorsel{object-position:80% center}
}

/* ── Masaüstü: tasarım pikseli ── */
@media (min-width:992px){
  /* Açılış: görsel 2077×757 kendi oranında; rozet görseldeki kutunun yerinde */
  .i-hero>.i-gorsel-kap{grid-area:1/1;align-self:start}
  .i-gorsel{aspect-ratio:auto}
  .i-gorsel-kap:after{background:linear-gradient(90deg,rgba(255,255,255,.97) 0,rgba(255,255,255,.9) 30%,rgba(255,255,255,0) 47%),linear-gradient(0deg,#fff 0,rgba(255,255,255,0) 12%)}
  .i-rozet{left:71.6%;top:68.9%;right:auto;bottom:auto;width:25%;height:17.6%;padding:0 calc(26 * var(--u));gap:calc(22 * var(--u));border-radius:calc(22 * var(--u));box-shadow:0 calc(14 * var(--u)) calc(36 * var(--u)) #1423441f}
  .i-rozet span{width:calc(80 * var(--u));height:calc(80 * var(--u))}
  .i-rozet span svg{width:calc(38 * var(--u));height:calc(38 * var(--u))}
  .i-rozet b{font-size:calc(26 * var(--u))}
  .i-rozet small{font-size:max(11px,calc(18.5 * var(--u)));margin-top:calc(6 * var(--u))}
  .i-hero>.s-ic{align-self:start;padding-top:calc(76 * var(--u))}
  .i-hero .a-kicker{margin-bottom:calc(30 * var(--u))}
  .i-hero h1{font-size:calc(68 * var(--u));line-height:1.09}
  .i-hero .s-lead{max-width:calc(560 * var(--u));font-size:max(15px,calc(22.5 * var(--u)));line-height:1.6;margin-top:calc(12 * var(--u))}
  .i-hero .s-butonlar{margin-top:calc(30 * var(--u))}
  .i-hero .s-butonlar .a-btn{padding:calc(24 * var(--u)) calc(46 * var(--u));font-size:max(14px,calc(20 * var(--u)));border-radius:calc(12 * var(--u))}

  .i-alt{font-size:max(13px,calc(20 * var(--u)));line-height:1.6;margin-top:calc(12 * var(--u))}

  /* Form + süreç: tasarımda 666–1470 px */
  .i-form-bolum{padding:calc(54 * var(--u)) 0 calc(30 * var(--u))}
  .i-form-bolum .a-kap{--k:74}
  .i-izgara{grid-template-columns:calc(808 * var(--u)) 1fr;gap:calc(83 * var(--u));align-items:start}
  .i-form-kart{padding:calc(34 * var(--u)) calc(50 * var(--u)) calc(30 * var(--u)) calc(54 * var(--u));border-radius:calc(22 * var(--u))}
  .i-form-kart h2{font-size:calc(40 * var(--u));line-height:1.2}
  .i-form-kart .i-alt{font-size:max(13px,calc(19 * var(--u)));margin-top:calc(10 * var(--u))}
  .i-alanlar{grid-template-columns:1fr 1fr;gap:calc(24 * var(--u)) calc(22 * var(--u));margin-top:calc(34 * var(--u))}
  .i-genis{grid-column:1/-1}
  .i-alan>svg{left:calc(20 * var(--u));width:calc(26 * var(--u));height:calc(26 * var(--u));margin-top:calc(-13 * var(--u))}
  .i-mesaj>svg{top:calc(18 * var(--u));margin-top:0}
  .i-alan .form-control,.i-alan .form-select{height:calc(60 * var(--u));padding-left:calc(66 * var(--u));border-radius:calc(12 * var(--u));font-size:max(13px,calc(19 * var(--u)))}
  .i-alan textarea.form-control{min-height:calc(124 * var(--u));height:calc(124 * var(--u));padding-top:calc(16 * var(--u))}
  .i-onay{gap:calc(18 * var(--u));margin-top:calc(26 * var(--u));font-size:max(11.5px,calc(16 * var(--u)));align-items:center}
  .i-onay .form-check-input{width:calc(28 * var(--u));height:calc(28 * var(--u))}
  .i-gonder{margin-top:calc(26 * var(--u));padding:calc(21 * var(--u));font-size:max(14px,calc(20 * var(--u)));border-radius:calc(10 * var(--u))}
  .i-not{font-size:max(11px,calc(14 * var(--u)));margin-top:calc(12 * var(--u))}

  .i-surec{padding-top:calc(16 * var(--u))}
  .i-surec h2{font-size:calc(54 * var(--u));line-height:1.1}
  .i-surec .a-kicker{margin-bottom:calc(20 * var(--u))}
  .i-surec .i-alt{max-width:calc(560 * var(--u));font-size:max(13px,calc(21 * var(--u)));line-height:1.55}
  .i-adimlar{margin-top:calc(40 * var(--u));padding-left:calc(54 * var(--u));gap:calc(64 * var(--u))}
  .i-adimlar:before{left:calc(7 * var(--u));top:calc(50 * var(--u));bottom:calc(50 * var(--u));width:calc(2 * var(--u))}
  .i-adimlar li{gap:calc(50 * var(--u))}
  .i-adimlar li:before{left:calc(-54 * var(--u));top:calc(46 * var(--u));width:calc(16 * var(--u));height:calc(16 * var(--u))}
  .i-adim-ikon{width:calc(108 * var(--u));height:calc(108 * var(--u));border-radius:calc(22 * var(--u))}
  .i-adim-ikon svg{width:calc(50 * var(--u));height:calc(50 * var(--u))}
  .i-adimlar h3{font-size:calc(31 * var(--u));gap:calc(18 * var(--u));margin-top:calc(8 * var(--u))}
  .i-adimlar h3 b{font-size:calc(32 * var(--u))}
  .i-adimlar p{font-size:max(13px,calc(19.5 * var(--u)));line-height:1.5;margin-top:calc(12 * var(--u));max-width:calc(430 * var(--u))}

  /* Bize ulaşın: 1470–2118 px */
  .i-ulasin{padding:calc(62 * var(--u)) 0 calc(60 * var(--u))}
  .i-ulasin .a-kap{--k:88}
  .i-ulasin-izgara{grid-template-columns:calc(520 * var(--u)) 1fr;gap:calc(44 * var(--u));align-items:start}
  .i-ulasin h2{font-size:calc(54 * var(--u));line-height:1.1}
  .i-ulasin .i-alt{max-width:calc(480 * var(--u));font-size:max(13px,calc(21.5 * var(--u)))}
  .i-bilgi{gap:calc(30 * var(--u));margin-top:calc(12 * var(--u));padding:calc(16 * var(--u)) calc(28 * var(--u));min-height:calc(112 * var(--u));border-radius:calc(18 * var(--u))}
  .i-ulasin .i-alt+.i-bilgi{margin-top:calc(30 * var(--u))}
  .i-bilgi+.i-bilgi{min-height:calc(130 * var(--u))}
  .i-bilgi>span{width:calc(80 * var(--u));height:calc(80 * var(--u));border-radius:calc(18 * var(--u))}
  .i-bilgi>span svg{width:calc(38 * var(--u));height:calc(38 * var(--u))}
  .i-bilgi b{font-size:max(12px,calc(19 * var(--u)))}
  .i-bilgi a{font-size:max(13px,calc(23 * var(--u)));margin-top:calc(4 * var(--u))}
  .i-bilgi address{font-size:max(12px,calc(20.5 * var(--u)));line-height:1.45;margin-top:calc(6 * var(--u))}
  .i-harita{border-radius:calc(22 * var(--u))}
  .i-yol{right:calc(33 * var(--u));bottom:calc(38 * var(--u));padding:calc(24 * var(--u)) calc(28 * var(--u));gap:calc(16 * var(--u));border-radius:calc(14 * var(--u));font-size:max(13px,calc(21 * var(--u)))}
  .i-yol svg{width:calc(24 * var(--u));height:calc(24 * var(--u))}

  /* Kapanış: 2118–2510 px */
  .i-cta>.s-gorsel{object-position:center 40%}
  .i-cta>.s-ic{align-self:start}
  .i-cta h2{font-size:calc(52 * var(--u));line-height:1.19}
  .i-cta .s-butonlar{margin-top:calc(32 * var(--u))}
  .i-cta .s-butonlar .a-btn{padding:calc(27 * var(--u)) calc(48 * var(--u));font-size:max(14px,calc(21 * var(--u)));border-radius:calc(12 * var(--u))}
}