/* ICEBERG — Taze Saklama Merkezi · stil sistemi */
:root{
  /* Marka renkleri (kurumsal kimlik kılavuzu) */
  --brand:        #0091a9;   /* Turkuaz — ana renk */
  --brand-deep:   #007580;   /* koyu turkuaz */
  --brand-aqua:   #00a6bc;
  --accent:       #00b7c6;   /* parlak cyan vurgu */
  --neutral:      #a7a9ac;   /* Warm Gray 4 C */

  /* Türetilmiş ferah / buz tonları */
  --ink:          #08232a;   /* derin teal-siyah, koyu bölümler */
  --ink-2:        #0c2e37;
  --ink-soft:     #14424d;
  --paper:        #ffffff;
  --mist:         #eef5f7;   /* buz beyazı zemin */
  --mist-2:       #e2eef1;
  --line:         #d8e4e8;
  --text:         #0e2a31;
  --text-soft:    #4a626a;
  --text-mute:    #8497a0;

  /* Tipografi */
  --font-display: 'Sora', system-ui, sans-serif;
  --font-body:    'Manrope', system-ui, sans-serif;

  /* Şekil */
  --r-sm: 8px;
  --r:    14px;
  --r-lg: 22px;
  --r-xl: 30px;
  --shadow-sm: 0 1px 2px rgba(8,35,42,.06), 0 2px 8px rgba(8,35,42,.05);
  --shadow:    0 8px 30px rgba(8,35,42,.10);
  --shadow-lg: 0 24px 64px rgba(8,35,42,.16);

  --maxw: 1240px;
  --gut: clamp(20px, 5vw, 64px);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--text);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  line-height:1.6;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:700;
  line-height:1.05;
  letter-spacing:-0.02em;
  margin:0;
  color:var(--text);
}
p{ margin:0; }

::selection{ background:var(--accent); color:#fff; }

/* ---------- Layout helpers ---------- */
.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding-inline:var(--gut); }
.section{ padding-block:clamp(64px, 9vw, 130px); }
.eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--font-body); font-weight:700;
  font-size:13px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--brand);
}
.eyebrow::before{
  content:""; width:26px; height:2px; background:var(--brand); border-radius:2px;
}
.eyebrow.on-dark{ color:var(--accent); }
.eyebrow.on-dark::before{ background:var(--accent); }

.h-xl{ font-size:clamp(34px, 5.6vw, 68px); }
.h-lg{ font-size:clamp(28px, 4vw, 46px); }
.h-md{ font-size:clamp(22px, 2.6vw, 30px); }
.lede{ font-size:clamp(17px, 1.5vw, 20px); color:var(--text-soft); line-height:1.65; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--font-display); font-weight:600; font-size:15px;
  padding:15px 26px; border-radius:999px; border:1.5px solid transparent;
  transition:transform .18s ease, background .2s ease, color .2s ease, box-shadow .2s ease, border-color .2s;
  white-space:nowrap;
}
.btn:active{ transform:translateY(1px); }
.btn-primary{ background:var(--brand); color:#fff; box-shadow:0 10px 24px rgba(0,145,169,.28); }
.btn-primary:hover{ background:var(--brand-deep); box-shadow:0 14px 30px rgba(0,145,169,.36); transform:translateY(-2px); }
.btn-ghost{ background:transparent; color:var(--text); border-color:var(--line); }
.btn-ghost:hover{ border-color:var(--brand); color:var(--brand); }
.btn-ghost.on-dark{ color:#fff; border-color:rgba(255,255,255,.35); }
.btn-ghost.on-dark:hover{ border-color:#fff; background:rgba(255,255,255,.08); }
.btn-white{ background:#fff; color:var(--ink); }
.btn-white:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(0,0,0,.18); }
.btn svg{ width:18px; height:18px; }

/* ---------- Header ---------- */
.hdr{
  position:fixed; inset:0 0 auto 0; z-index:60;
  transition:background .3s ease, box-shadow .3s ease, padding .3s ease;
  padding-block:18px;
}
.hdr.float{ background:rgba(255,255,255,.9); backdrop-filter:blur(14px); box-shadow:0 1px 0 var(--line); padding-block:12px; }
.hdr-inner{ display:flex; align-items:center; gap:32px; }
.brandmark{ display:flex; align-items:center; gap:13px; }
.logo-full{ height:46px; width:auto; display:block; transition:height .3s ease; }
.hdr.float .logo-full{ height:38px; }
.footer-brand .logo-full{ height:62px; }
.brandmark .logo-ico{ width:40px; height:40px; flex:none; }
.brandmark .logo-txt{ display:flex; flex-direction:column; line-height:1; }
.brandmark .logo-name{ font-family:var(--font-display); font-weight:800; font-size:23px; letter-spacing:-.02em; color:var(--text); }
.brandmark .logo-sub{ font-size:9.5px; letter-spacing:.34em; font-weight:700; color:var(--brand); margin-top:4px; }
.hdr.invert .logo-name{ color:#fff; }
.hdr.invert .logo-sub{ color:var(--accent); }

.nav{ display:flex; align-items:center; gap:6px; margin-left:auto; }
.nav a{
  font-family:var(--font-display); font-weight:500; font-size:15px;
  padding:9px 15px; border-radius:999px; color:var(--text-soft);
  transition:color .18s, background .18s;
}
.hdr.invert .nav a{ color:rgba(255,255,255,.82); }
.nav a:hover{ color:var(--brand); }
.hdr.invert .nav a:hover{ color:#fff; background:rgba(255,255,255,.1); }
.nav a.active{ color:var(--brand); }
.hdr.invert .nav a.active{ color:#fff; }
.hdr-cta{ margin-left:8px; }

.burger{ display:none; margin-left:auto; width:46px; height:46px; border-radius:12px; border:1.5px solid var(--line); background:#fff; align-items:center; justify-content:center; }
.burger span{ display:block; width:20px; height:2px; background:var(--text); position:relative; }
.burger span::before,.burger span::after{ content:""; position:absolute; left:0; width:20px; height:2px; background:var(--text); }
.burger span::before{ top:-6px; } .burger span::after{ top:6px; }

/* mobile drawer */
.drawer{ position:fixed; inset:0; z-index:70; display:none; }
.drawer.open{ display:block; }
.drawer-bg{ position:absolute; inset:0; background:rgba(8,35,42,.5); backdrop-filter:blur(3px); }
.drawer-panel{ position:absolute; top:0; right:0; bottom:0; width:min(82vw,340px); background:#fff; padding:26px; display:flex; flex-direction:column; gap:6px; box-shadow:var(--shadow-lg); }
.drawer-panel a{ font-family:var(--font-display); font-weight:600; font-size:19px; padding:15px 8px; border-bottom:1px solid var(--line); color:var(--text); }
.drawer-panel a:last-of-type{ border-bottom:none; }
.drawer-close{ align-self:flex-end; width:42px;height:42px;border-radius:10px;border:1px solid var(--line);background:#fff;font-size:22px;color:var(--text); margin-bottom:8px; }

/* ---------- Footer ---------- */
.footer{ background:var(--ink); color:rgba(255,255,255,.72); padding-block:72px 32px; }
.footer a{ color:rgba(255,255,255,.72); transition:color .18s; }
.footer a:hover{ color:#fff; }
.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:40px; }
.footer h4{ color:#fff; font-size:15px; letter-spacing:.04em; margin-bottom:18px; }
.footer-col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px; font-size:15px; }
.footer-bottom{ margin-top:54px; padding-top:24px; border-top:1px solid rgba(255,255,255,.12); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:13.5px; color:rgba(255,255,255,.5); }
.footer .logo-name{ color:#fff; font-size:25px; }
.footer .logo-sub{ color:var(--accent); }
.footer-social{ display:flex; gap:11px; margin-top:20px; }
.footer-social a{ width:38px; height:38px; border-radius:10px; border:1px solid rgba(255,255,255,.16); display:flex; align-items:center; justify-content:center; font-size:18px; color:rgba(255,255,255,.82); transition:background .2s, border-color .2s, color .2s, transform .2s; }
.footer-social a:hover{ background:var(--brand); border-color:var(--brand); color:#fff; transform:translateY(-2px); }

/* ---------- Reusable bits ---------- */
.chip{
  display:inline-flex; align-items:center; gap:7px;
  font-family:var(--font-display); font-weight:600; font-size:13px;
  padding:7px 13px; border-radius:999px;
  background:var(--mist); color:var(--brand-deep); border:1px solid var(--line);
}
.chip.temp{ background:rgba(0,145,169,.1); color:var(--brand-deep); border-color:rgba(0,145,169,.2); }
.divider{ height:1px; background:var(--line); border:none; }

/* fade-in on scroll */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s cubic-bezier(.2,.7,.3,1), transform .7s cubic-bezier(.2,.7,.3,1); }
.reveal.in{ opacity:1; transform:none; }

/* page transition */
.page-enter{ animation:pageIn .5s cubic-bezier(.2,.7,.3,1) both; }
@keyframes pageIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }

@media (max-width:900px){
  .nav, .hdr-cta{ display:none; }
  .burger{ display:flex; }
  .footer-grid{ grid-template-columns:1fr 1fr; gap:32px; }
}
@media (max-width:560px){
  .footer-grid{ grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  .page-enter{ animation:none; }
}