/* Tema B · kirikkalearackirala.com · antrasit + kırmızı · Barlow Condensed / Barlow */
:root{
  --display:'Barlow Condensed',system-ui,sans-serif;--body:'Barlow',system-ui,sans-serif;
  --bg:#F5F6F8;--surface:#FFFFFF;--soft:#F0F1F3;--ink:#1C1F24;--heading:#1C1F24;--muted:#5A606B;--label:#33373E;--line:#E3E5E9;
  --brand:#1C1F24;--brand-2:#26292F;--accent:#D7263D;--accent-hover:#B01E31;--on-accent:#FFFFFF;--accent-text:#B01E31;
  --link:#B01E31;--link-hover:#8A1726;--focus:#D7263D;
  --ok:#1F7A4A;--ok-bg:#E3F2EA;--busy:#1C1F24;--busy-bg:#E4E6EA;--wa:#1F7A4A;--wa-hover:#18633B;
  --field-line:#D5D8DD;--field-bg:#FFFFFF;--field-ink:#1C1F24;--ph-bg:#ECEEF1;--ann-bg:#1C1F24;
  --r:14px;--r-sm:8px;
}
body{font-size:17px}
section{scroll-margin-top:80px}
.up{text-transform:uppercase}
.h2{font-family:var(--display);font-weight:800;font-size:clamp(38px,5vw,52px);line-height:1;text-transform:uppercase}
.h2 em,.hl{font-style:normal;color:var(--accent)}
.dark .h2 em{color:#FF5C6F}
.sec{padding-top:72px;padding-bottom:72px}
.head-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px}
.lead{font-size:17px;line-height:1.6;color:#4A4F58}
.white{background:#fff;border-top:1px solid var(--line)}
.dark{background:#1C1F24;color:#fff}
.dark h2,.dark h3{color:#fff}
.ann{border-bottom:1px solid #33373E}
.ann-badge{background:var(--accent);color:#fff;font-family:var(--display);font-size:17px;border-radius:4px;padding:3px 10px}
.ann a{color:#FF7A8A}

/* Kırmızı şerit + başlık */
.strip{background:var(--accent);color:#fff;font-size:14px;font-weight:600}
.strip .wrap{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;padding-top:9px;padding-bottom:9px}
.strip a{color:#fff;text-decoration:none}
.hdr{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
.hdr .wrap{display:flex;gap:16px;align-items:center;justify-content:space-between;padding-top:12px;padding-bottom:12px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.logo b{white-space:nowrap;font-family:var(--display);font-weight:800;font-size:26px;color:var(--ink);letter-spacing:.5px;line-height:1;display:block}
.logo b span{color:var(--accent)}
.logo small{font-size:12px;color:var(--muted);font-weight:600;letter-spacing:1px}
.nav{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:16px;font-weight:600}
.nav a{white-space:nowrap}
.nav a{color:var(--ink);text-decoration:none}
.nav a:hover{color:var(--accent)}
.menu-btn{display:none;width:46px;height:46px;border-radius:8px;border:1px solid var(--line);background:#fff;align-items:center;justify-content:center;cursor:pointer}

/* Kahraman */
.hero{display:flex;flex-wrap:wrap;gap:40px;align-items:center;padding-top:56px;padding-bottom:64px}
.hero-txt{flex:1 1 540px;min-width:0;display:flex;flex-direction:column;gap:22px}
.badge-line{align-self:flex-start;font-weight:700;font-size:14px;color:var(--accent-text);border:1.5px solid var(--accent);border-radius:6px;padding:6px 12px;letter-spacing:1px}
.hero h1{font-weight:800;font-size:clamp(48px,7vw,76px);line-height:.95;text-transform:uppercase;letter-spacing:-.5px}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero p{font-size:19px;line-height:1.6;color:#4A4F58;max-width:540px}
.ticks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 20px;max-width:520px;font-weight:600}
.ticks span{display:inline-flex;gap:10px;align-items:center}
.ticks i{width:26px;height:26px;border-radius:6px;background:var(--accent);display:inline-flex;align-items:center;justify-content:center;flex:none}

/* Koyu teklif formu */
.req{flex:1 1 400px;min-width:0;background:#1C1F24;color:#fff;border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
.tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.tabs label{position:relative}
.tabs input{position:absolute;opacity:0;inset:0}
.tabs span{display:flex;align-items:center;justify-content:center;border-bottom:4px solid #33373E;background:#1C1F24;color:#B9BDC5;font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:.5px;padding:16px;min-height:56px;text-transform:uppercase;cursor:pointer}
.tabs input:checked+span{border-bottom-color:var(--accent);background:#26292F;color:#fff;font-weight:800}
.tabs input:focus-visible+span{outline:3px solid #fff;outline-offset:-3px}
.req-body{padding:26px;display:flex;flex-direction:column;gap:18px}
.req .fld{color:#B9BDC5;letter-spacing:.6px;text-transform:uppercase}
.req .fld input,.req .fld select,.req .fld textarea{font-size:17px;font-weight:600;padding:10px 0;border:0;border-bottom:2px solid #4A4F58;border-radius:0;background:transparent;color:#fff;min-height:44px;text-transform:none;letter-spacing:0}
.req .fld input:focus,.req .fld select:focus{border-bottom-color:var(--accent);outline:none}
.req .fld select option{color:#1C1F24}
.req .fld input::placeholder{color:#7C828C}
.req .fld input[type=datetime-local]{color-scheme:dark}
.req .fld.err input,.req .fld.err select{border-bottom-color:#FF5C6F}
.req .check{color:#C7CBD2}
.req .check a{color:#FF7A8A}
.req .form-note{color:#9CA1AA;text-align:center}
.dash{display:flex;gap:10px;align-items:center;border:1px dashed var(--accent);border-radius:8px;padding:10px 12px;font-size:14px;color:#E6E8EB}
.dash b{font-family:var(--display);font-weight:800;font-size:18px;color:#FF5C6F;white-space:nowrap}
.big-btn{font-family:var(--display);font-weight:800;font-size:22px;text-transform:uppercase;letter-spacing:.5px;padding:16px;border-radius:10px;min-height:56px}

/* Fırsat */
.deal{background:#fff;border-radius:16px;overflow:hidden;display:flex;flex-wrap:wrap;border:1px solid var(--line)}
.deal-side{flex:0 1 260px;background:var(--accent);color:#fff;padding:26px;display:flex;flex-direction:column;justify-content:center;gap:6px}
.deal-side span{font-family:var(--display);font-size:16px;font-weight:700;letter-spacing:2px}
.deal-side b{font-family:var(--display);font-size:44px;font-weight:800;line-height:.95;text-transform:uppercase}
.deal-main{flex:1 1 560px;min-width:0;padding:22px 28px;display:flex;flex-wrap:wrap;gap:20px 32px;align-items:center;justify-content:space-between}
.deal-main h2{font-family:var(--display);font-size:30px;text-transform:uppercase;line-height:1}
.deal-price{display:flex;flex-direction:column;align-items:flex-end}
.deal-price s{color:var(--muted);font-size:17px}
.deal-price b{font-family:var(--display);font-size:46px;font-weight:800;line-height:1;color:var(--accent)}
.deal-price b small{font-size:18px;color:var(--muted);font-weight:600}
.cd-txt{font-family:var(--display);font-size:32px;font-weight:800;letter-spacing:1px}
.deal-foot{flex:1 1 100%;font-size:12px;color:var(--muted);padding:0 28px 14px;text-align:right}

/* Teslim yerleri bandı */
.places{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.places .wrap{padding-top:28px;padding-bottom:28px;display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center}
.places b{font-family:var(--display);font-size:24px;text-transform:uppercase}
.chip{border:1px solid #D5D8DD;border-radius:999px;padding:8px 14px;font-weight:600;display:inline-block}
.chip.soon{border:1px dashed var(--accent);color:var(--accent-text);font-weight:700}

/* Araç satırları */
.fbtns{display:flex;flex-wrap:wrap;gap:8px}
.fbtns button{font-weight:600;padding:10px 16px;border-radius:8px;border:1px solid #D5D8DD;background:#fff;color:var(--ink);min-height:44px;cursor:pointer}
.fbtns button[aria-pressed="true"]{border-color:#1C1F24;background:#1C1F24;color:#fff;font-weight:700}
.rows{display:flex;flex-direction:column;gap:16px;margin-top:24px}
.row{background:#fff;border-radius:14px;display:flex;flex-wrap:wrap;overflow:hidden;border:1px solid var(--line)}
.row.busy{background:#FAFAFB}
.row .ph{flex:1 1 300px;min-height:200px}
.row .st{position:absolute;left:0;top:18px;color:#fff;font-weight:700;font-size:13px;padding:6px 12px;background:var(--ok);text-transform:uppercase}
.row.busy .st{background:#1C1F24}
.row .vbtn{position:absolute;right:12px;bottom:12px;font-size:13px;font-weight:700;border:0;border-radius:6px;background:#1C1F24;color:#fff;padding:8px 12px;min-height:36px;display:inline-flex;gap:6px;align-items:center;cursor:pointer}
.row-body{flex:2 1 420px;padding:24px 28px;display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between}
.row h3{font-size:34px;line-height:1;text-transform:uppercase}
.row h3 a{color:inherit;text-decoration:none}
.row h3 small{color:var(--muted);font-weight:600;font-size:inherit}
.row.busy h3{color:#4A4F58}
.pills{display:flex;flex-wrap:wrap;gap:8px;font-size:14px;font-weight:600}
.pills span{background:#F0F1F3;padding:6px 10px;border-radius:6px}
.pills .svc-pill{background:#FCE9EB;color:#8A1726}
.row-info{flex:1 1 280px;min-width:0;display:flex;flex-direction:column;gap:10px}
.row-price{flex:0 0 auto;display:flex;flex-direction:column;gap:10px;align-items:flex-end}
.row-price .p{font-family:var(--display);font-size:40px;font-weight:800;line-height:1;text-align:right;white-space:nowrap}
.row-price .p small{font-size:18px;font-weight:600;color:var(--muted)}
.row-price .p s{display:block;font-size:18px;color:var(--muted);font-weight:600}
.row.busy .p{color:#4A4F58}
.row-price .vat{text-align:right;margin-top:4px}

/* Erken rezervasyon kutusu */
.early{background:#1C1F24;color:#fff;border-radius:16px;padding:36px;display:flex;flex-wrap:wrap;gap:32px;align-items:center}
.early>div{flex:1 1 360px;min-width:0;display:flex;flex-direction:column;gap:14px}
.early h2{color:#fff;font-size:50px;line-height:.95;text-transform:uppercase;font-weight:800}
.early h2 em{font-style:normal;color:#FF5C6F}
.etiers{display:flex;gap:10px;flex-wrap:wrap}
.etiers span{background:#26292F;border-radius:10px;padding:12px 18px;display:flex;flex-direction:column}
.etiers span:last-child{background:var(--accent)}
.etiers b{font-family:var(--display);font-size:32px;line-height:1}
.etiers small{font-size:14px;color:#C7CBD2}
.esteps{flex:2 1 560px;min-width:0;margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}
.esteps li{background:#26292F;border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:8px}
.esteps b{font-family:var(--display);font-size:22px;font-weight:800;color:#FF5C6F}
.esteps li:last-child b{color:#5FD39A}
.esteps span{color:#E6E8EB;line-height:1.5}

/* Neden */
.why{display:flex;flex-wrap:wrap;gap:40px}
.why>div{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:14px}
.why ol{flex:2 1 640px;min-width:0;margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:0 32px}
.why li{display:flex;gap:16px;padding:18px 0;border-bottom:1px solid var(--line)}
.why li>b{font-family:var(--display);font-size:34px;font-weight:800;color:var(--accent);line-height:1}
.why li span b{font-size:18px;display:block}
.why li span span{color:#4A4F58;line-height:1.5}

/* Hizmet kartları */
.svc3{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin-top:32px}
.svc3>div{background:#26292F;border-radius:14px;padding:28px;display:flex;flex-direction:column;gap:12px}
.svc3>div.red{background:var(--accent)}
.svc3 small{font-family:var(--display);font-size:15px;font-weight:700;color:#FF7A8A;letter-spacing:1px}
.svc3 .red small{color:#FFE1E5}
.svc3 b{font-family:var(--display);font-size:30px;text-transform:uppercase;line-height:1}
.svc3 p{color:#C7CBD2;line-height:1.6}
.svc3 .red p{color:#fff}
.svc3 a{color:#FF7A8A;font-weight:700;margin-top:auto}
.svc3 .red a{color:#fff}
.ltiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:8px;margin-top:4px}
.ltiers span{background:#B01E31;border-radius:8px;padding:10px 6px;text-align:center;display:flex;flex-direction:column;font-size:13px}
.ltiers span:last-child{background:#fff;color:#B01E31}
.ltiers b{font-family:var(--display);font-size:24px}

/* Teslim süreci */
.line4{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));border-top:4px solid var(--accent);margin-top:28px}
.line4 div{padding:22px 20px 0 0;display:flex;flex-direction:column;gap:6px}
.line4 b{font-family:var(--display);font-size:22px;font-weight:800;color:var(--accent);text-transform:uppercase}
.line4 span{color:#4A4F58;line-height:1.5}
.media{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}
.media .v{flex:2 1 520px;min-width:0;min-height:300px;border-radius:14px;background:#1C1F24;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:20px}
.media .v b{font-family:var(--display);font-size:24px;text-transform:uppercase}
.play{width:72px;height:72px;border-radius:50%;border:0;background:var(--accent);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.media .g{flex:1 1 280px;min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.media .g>*{border-radius:12px;background:#E4E6EA;display:flex;align-items:flex-end;padding:12px;font-size:13px;font-weight:700;color:#4A4F58;min-height:140px;position:relative;overflow:hidden;margin:0}
.media .g img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.media .g figcaption{position:relative;background:rgba(255,255,255,.92);border-radius:6px;padding:3px 8px}

/* Ekstralar + şartlar */
.two{display:flex;flex-wrap:wrap;gap:40px}
.two>div{flex:1 1 460px;min-width:0;display:flex;flex-direction:column;gap:16px}
.two h2{font-family:var(--display);font-weight:800;font-size:44px;line-height:1;text-transform:uppercase}
.list>div{display:flex;justify-content:space-between;gap:12px;padding:16px 0;border-bottom:1px solid var(--line)}
.list>div:last-child{border-bottom:0}
.list span span{font-size:14px;color:var(--muted)}
.note{background:#F5F6F8;border-radius:12px;padding:16px 18px;display:flex;flex-direction:column;gap:8px;font-size:15px;line-height:1.5;color:#33373E}
.terms{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.terms li{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
.terms li:last-child{border-bottom:0}
.terms b{color:var(--accent);min-width:120px}

/* Yorumlar */
.score{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 18px}
.score>b{font-family:var(--display);font-size:40px;font-weight:800;line-height:1}
.qgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;margin-top:28px}
.qgrid figure{margin:0;background:#fff;border-radius:14px;border-top:4px solid var(--accent);padding:26px;display:flex;flex-direction:column;gap:14px}
.qgrid .q{font-family:var(--display);font-size:64px;line-height:.6;color:var(--accent)}
.qgrid blockquote{margin:0;font-size:17px;line-height:1.6;color:#33373E}
.qgrid figcaption{display:flex;justify-content:space-between;font-size:14px;gap:10px}
.sample{align-self:flex-start;font-size:12px;font-weight:700;color:#8A1726;background:#FCE9EB;padding:6px 10px;border-radius:6px}

/* Sosyal */
.social .wrap{padding-top:64px;padding-bottom:64px;display:flex;flex-wrap:wrap;gap:32px;align-items:center}
.social .wrap>div:first-child{flex:1 1 360px;min-width:0;display:flex;flex-direction:column;gap:16px}
.social h2{font-family:var(--display);font-weight:800;font-size:52px;line-height:.95;text-transform:uppercase}
.social h2 em{font-style:normal;color:#FF5C6F}
.social p{color:#C7CBD2}
.reels{flex:1 1 520px;min-width:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.reels a{aspect-ratio:9/14;border-radius:12px;background:#26292F;color:#fff;text-decoration:none;display:flex;flex-direction:column;justify-content:flex-end;padding:14px;gap:2px;border-bottom:4px solid var(--accent);position:relative;overflow:hidden}
.reels a:nth-child(2){background:#2E3138}
.reels img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.reels b,.reels span{position:relative}
.reels b{font-family:var(--display);font-size:20px;text-transform:uppercase}
.reels span{font-size:13px;color:#9CA1AA}
.sbtn{background:#26292F;color:#fff;text-decoration:none;font-weight:700;padding:12px 18px;border-radius:8px;min-height:44px;display:inline-flex;align-items:center;gap:8px}
.sbtn:hover{background:#33373E;color:#fff}
.sbtn.red{background:var(--accent)}

/* SSS */
.faqwrap{display:flex;flex-wrap:wrap;gap:40px}
.faqwrap>div:first-child{flex:1 1 320px;min-width:0;display:flex;flex-direction:column;gap:14px}
.faqwrap .faq{flex:2 1 620px;min-width:0}
.faq summary{font-size:19px}

/* Kırmızı CTA */
.cta{background:var(--accent);color:#fff}
.cta .wrap{padding-top:48px;padding-bottom:48px;display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:center}
.cta h2{color:#fff;font-weight:800;font-size:clamp(34px,4.6vw,48px);line-height:1;text-transform:uppercase}

/* Altbilgi */
.ftr{background:#15171B;color:#B9BDC5;font-size:15px}
.ftr .cols{padding-top:64px;padding-bottom:40px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:40px}
.ftr .cols>*{display:flex;flex-direction:column;gap:12px}
.ftr .t{color:#fff;font-family:var(--display);font-size:20px;text-transform:uppercase;font-weight:700}
.ftr a{color:#B9BDC5;text-decoration:none}
.ftr a:hover{color:#fff}
.ftr .soc{display:flex;flex-wrap:wrap;gap:10px}
.ftr .soc a{width:44px;height:44px;border-radius:10px;background:#26292F;display:inline-flex;align-items:center;justify-content:center}
.ftr .bottom{border-top:1px solid #2A2D33}
.ftr .bottom .wrap{padding-top:18px;padding-bottom:18px;display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;align-items:center;font-size:13px}
.ftr .bottom nav{display:flex;flex-wrap:wrap;gap:18px}
.fab{height:56px;padding:0 22px;border-radius:999px;font-weight:700}

/* Ortak sayfalarda koyu başlıklar büyük harf */
.vd-title,.doc h1,.center-card h1{text-transform:uppercase}
.price{font-weight:800}

@media (max-width:1300px){
  .menu-btn{display:inline-flex}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;flex-direction:column;gap:0;padding:8px 16px 16px;border-bottom:1px solid var(--line)}
  .nav a{padding:12px 4px;border-bottom:1px solid var(--line)}
  .hdr.open .nav{display:flex}
  .hdr .btn-dark{display:none}
}
@media (max-width:640px){
  .strip .hide-sm{display:none}
  .logo svg{width:60px;height:40px}
  .logo b{font-size:21px}
  .hero{padding-top:32px;padding-bottom:40px}
  .ticks{grid-template-columns:1fr}
  .req-body{padding:20px}
  .early{padding:24px}
  .early h2{font-size:40px}
  .row-body{padding:18px}
  .row-price{align-items:flex-start}
  .row h3{font-size:28px}
  .reels{grid-template-columns:repeat(2,minmax(0,1fr))}
  .reels a:nth-child(3){display:none}
  .fab{right:16px;bottom:16px;padding:0 18px}
}
@media (max-width:420px){
  .logo{gap:8px}
  .logo svg{width:48px;height:32px}
  .logo b{font-size:18px}
  .logo small{font-size:11px}
}
@media (max-width:380px){
  .hdr .wrap{gap:8px}
  .logo svg{width:38px;height:26px}
  .logo b{font-size:16px}
}
@media (max-width:640px){
  .logo b{white-space:normal;line-height:.95}
  .logo b span{display:block}
  .logo{min-width:0}
}
@media (max-width:380px){ .hero h1{font-size:42px} .h2{font-size:34px} }
