/* ============================================================
   PLATIN AUTO PREMIUM SERVIS — style.css
   ============================================================ */

:root{
  --ink:#0a0b0d;
  --ink-2:#121317;
  --ink-3:#1b1d22;
  --chrome:#f4f5f3;
  --chrome-dim:#9aa0a6;
  --line:rgba(244,245,243,.12);
  --brass:#c9a24a;
  --brass-2:#e8c877;
  --paper:#f3efe6;
  --paper-ink:#1c1a15;
  --paper-dim:#6f6a5c;
  --paper-line:rgba(28,26,21,.12);
  --radius:14px;
  --ease:cubic-bezier(.22,.68,0,1);
  --nav-h:76px;
}

*,*::before,*::after{box-sizing:border-box;}
html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  width:100%;
  overflow-x:hidden;
}
body{
  margin:0;
  width:100%;
  min-width:0;
  background:var(--ink);
  color:var(--chrome);
  font-family:'IBM Plex Sans',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  position:relative;
}
button,input,textarea{font-family:inherit;}
a,button{-webkit-tap-highlight-color:transparent;touch-action:manipulation;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
svg{display:block;}
::selection{background:var(--brass);color:var(--ink);}

.container{
  width:100%;
  max-width:1180px;
  margin:0 auto;
  padding:0 24px;
}

.h-display{
  font-family:'Bebas Neue',sans-serif;
  font-weight:400;
  letter-spacing:.01em;
  line-height:.98;
  margin:10px 0 0;
  font-size:clamp(2.1rem,4.6vw,3.6rem);
  text-transform:uppercase;
}
.eyebrow{
  display:inline-block;
  font-family:'IBM Plex Mono',monospace;
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--brass);
}
.accent{color:var(--brass);}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 24px;
  border-radius:999px;
  font-family:'IBM Plex Sans',sans-serif;
  font-weight:600;
  font-size:.92rem;
  border:1px solid transparent;
  cursor:pointer;
  transition:transform .25s var(--ease),background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease);
}
.btn svg{width:17px;height:17px;}
.btn:hover{transform:translateY(-2px);}
.btn-brass{background:linear-gradient(135deg,var(--brass-2),var(--brass));color:#171205;}
.btn-brass:hover{box-shadow:0 10px 26px -8px rgba(201,162,74,.55);}
.btn-ghost{background:transparent;color:var(--chrome);border-color:var(--line);}
.btn-ghost:hover{border-color:var(--brass);color:var(--brass);}
.btn-ghost.on-paper-btn{color:var(--paper-ink);border-color:var(--paper-line);}
.btn-ghost.on-paper-btn:hover{border-color:var(--brass);color:#8a6b1f;}
.btn-sm{padding:10px 18px;font-size:.82rem;}

/* ---------- whatsapp floating button ---------- */
.wa-float{
  position:fixed;
  right:calc(20px + env(safe-area-inset-right, 0px));
  bottom:calc(20px + env(safe-area-inset-bottom, 0px));
  width:56px;
  height:56px;
  border-radius:50%;
  background:#25d366;
  color:#0a0b0d;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 12px 26px -8px rgba(37,211,102,.6);
  z-index:80;
  animation:waPulse 2.6s ease-in-out infinite;
}
.wa-float svg{width:28px;height:28px;fill:#0a0b0d;}
@keyframes waPulse{
  0%,100%{box-shadow:0 12px 26px -8px rgba(37,211,102,.6);}
  50%{box-shadow:0 12px 30px -4px rgba(37,211,102,.85);}
}

/* ---------- nav ---------- */
.nav{
  position:fixed;
  top:0;left:0;right:0;
  z-index:90;
  min-height:var(--nav-h);
  padding-top:env(safe-area-inset-top, 0px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-left:calc(28px + env(safe-area-inset-left, 0px));
  padding-right:calc(28px + env(safe-area-inset-right, 0px));
  background:rgba(10,11,13,.55);
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid var(--line);
  transition:background .3s var(--ease);
}
.plate{display:flex;align-items:center;gap:10px;}
.plate-text{display:flex;flex-direction:column;line-height:1;}
.plate-name{
  font-family:'Bebas Neue',sans-serif;
  font-size:1.7rem;
  letter-spacing:.05em;
  color:var(--chrome);
  line-height:1;
  white-space:nowrap;
}
.plate-name em{
  font-style:normal;
  color:var(--brass);
  margin-left:.15em;
}
.plate-sub{
  font-size:.6rem;
  letter-spacing:.24em;
  color:var(--brass);
  white-space:nowrap;
  margin-top:2px;
}
.nav-links{
  display:flex;
  align-items:center;
  gap:30px;
}
.nav-links a{
  font-size:.86rem;
  font-weight:500;
  color:var(--chrome-dim);
  position:relative;
  padding:6px 0;
  transition:color .25s var(--ease);
}
.nav-links a::after{
  content:'';
  position:absolute;left:0;bottom:0;
  width:0;height:1px;background:var(--brass);
  transition:width .25s var(--ease);
}
.nav-links a:hover{color:var(--chrome);}
.nav-links a:hover::after{width:100%;}

.nav-right{display:flex;align-items:center;gap:16px;}
.btn-wa-nav{display:inline-flex;}

.menu-btn{
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:40px;height:40px;
  background:transparent;
  border:1px solid var(--line);
  border-radius:10px;
  cursor:pointer;
}
.menu-btn span{
  display:block;width:18px;height:2px;margin:0 auto;
  background:var(--chrome);
  transition:transform .3s var(--ease),opacity .3s var(--ease);
}
.menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.menu-btn[aria-expanded="true"] span:nth-child(2){opacity:0;}
.menu-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.drawer{
  position:fixed;
  top:calc(var(--nav-h) + env(safe-area-inset-top, 0px));left:0;right:0;
  z-index:85;
  background:var(--ink-2);
  border-bottom:1px solid var(--line);
  display:flex;
  flex-direction:column;
  padding:10px 28px 26px;
  gap:4px;
  transform:translateY(-8px);
  opacity:0;
  pointer-events:none;
  transition:opacity .28s var(--ease),transform .28s var(--ease);
}
.drawer.open{opacity:1;transform:translateY(0);pointer-events:auto;}
.drawer a{
  padding:13px 4px;
  border-bottom:1px solid var(--line);
  font-size:.98rem;
  color:var(--chrome);
}
.drawer .btn{margin-top:14px;justify-content:center;}

/* ---------- hero ---------- */
.hero{
  position:relative;
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.hero-media{position:absolute;inset:0;z-index:0;background:#000;}
.hero-video{
  width:100%;height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.hero-scrim{
  position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(180deg, rgba(10,11,13,.55) 0%, rgba(10,11,13,.35) 32%, rgba(10,11,13,.72) 82%, var(--ink) 100%),
    linear-gradient(90deg, rgba(10,11,13,.55) 0%, rgba(10,11,13,0) 40%, rgba(10,11,13,0) 60%, rgba(10,11,13,.55) 100%);
}
.hero-content{
  position:relative;z-index:2;
  padding-top:calc(var(--nav-h) + env(safe-area-inset-top, 0px) + 40px);
  padding-bottom:60px;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.hero h1.h-display{font-size:clamp(3.2rem,9vw,6.4rem);margin-top:14px;}
.hero-slogan{
  font-family:'IBM Plex Mono',monospace;
  color:var(--brass-2);
  margin:14px 0 6px;
  font-size:1rem;
  letter-spacing:.04em;
}
.hero-sub{
  max-width:46ch;
  color:var(--chrome-dim);
  line-height:1.65;
  font-size:.98rem;
  margin:6px 0 30px;
}
.btn-row{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;}
.scroll-cue{
  position:relative;z-index:2;
  display:flex;flex-direction:column;align-items:center;gap:8px;
  color:var(--chrome-dim);
  font-family:'IBM Plex Mono',monospace;
  font-size:.68rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  margin-bottom:34px;
}
.scroll-cue .stick{
  width:1px;height:34px;
  background:linear-gradient(var(--brass), transparent);
  animation:cueMove 1.8s ease-in-out infinite;
}
@keyframes cueMove{0%,100%{transform:translateY(0);opacity:.4;}50%{transform:translateY(8px);opacity:1;}}

/* ---------- generic sections ---------- */
.section{
  position:relative;
  padding:96px 0;
  scroll-margin-top:calc(var(--nav-h) + env(safe-area-inset-top, 0px));
}
.vision-wrap{scroll-margin-top:calc(var(--nav-h) + env(safe-area-inset-top, 0px));}
.section.on-paper{
  background:var(--paper);
  color:var(--paper-ink);
}
.section-head{max-width:640px;margin:0 auto 48px;text-align:center;}
.section-head .h-display{margin-top:12px;}
.section-sub{
  margin-top:14px;
  color:var(--chrome-dim);
  line-height:1.6;
  font-size:.98rem;
}
.on-paper .section-sub{color:var(--paper-dim);}

/* scroll reveal */
.reveal{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .7s var(--ease),transform .7s var(--ease);
}
.reveal.in-view{opacity:1;transform:translateY(0);}
.grid-stagger .reveal{transition-delay:calc(var(--i,0) * 70ms);}

/* ---------- contact section ---------- */
.contact-wrap{
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:48px;
  align-items:start;
}
.contact-info{
  background:#fff;
  border:1px solid var(--paper-line);
  border-radius:var(--radius);
  padding:30px;
  display:flex;flex-direction:column;gap:20px;
}
.addr-row{display:flex;gap:14px;align-items:flex-start;}
.addr-row svg{width:22px;height:22px;flex:none;color:var(--brass);margin-top:2px;}
.addr-row p{margin:0;font-size:.92rem;line-height:1.6;color:var(--paper-ink);}
.addr-row p strong{display:block;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--paper-dim);margin-bottom:3px;}
.contact-form{
  background:#fff;
  border:1px solid var(--paper-line);
  border-radius:var(--radius);
  padding:30px;
  display:flex;flex-direction:column;gap:16px;
}
.form-field{display:flex;flex-direction:column;gap:7px;}
.form-field span{font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--paper-dim);}
.form-field input,.form-field textarea{
  border:1px solid var(--paper-line);
  border-radius:9px;
  padding:12px 14px;
  font-family:inherit;
  font-size:16px;
  color:var(--paper-ink);
  background:#faf8f2;
  resize:vertical;
  transition:border-color .2s var(--ease);
  width:100%;
}
.form-field input:focus,.form-field textarea:focus{outline:none;border-color:var(--brass);}
.contact-form .btn{align-self:flex-start;margin-top:4px;}
.form-note{margin:0;font-size:.76rem;color:var(--paper-dim);}

/* ---------- section video backgrounds ---------- */
.section-video-bg{
  position:absolute;inset:0;
  overflow:hidden;
  z-index:0;
  background:linear-gradient(160deg,#15171b,#0a0b0d 70%);
}
.section-media-paper .section-video-bg{background:linear-gradient(160deg,#e9e3d3,var(--paper) 70%);}
.bg-video{
  width:100%;height:100%;
  object-fit:cover;
  object-position:center;
  opacity:0;
  transition:opacity .8s var(--ease);
}
.bg-video.is-visible{opacity:1;}
.section-video-bg.video-unavailable .bg-video{opacity:0 !important;}
.section-video-scrim{position:absolute;inset:0;}
.scrim-dark{background:linear-gradient(180deg,rgba(10,11,13,.86),rgba(10,11,13,.62) 40%,rgba(10,11,13,.9));}
.scrim-paper{background:linear-gradient(180deg,rgba(243,239,230,.94),rgba(243,239,230,.8) 40%,rgba(243,239,230,.96));}

/* ---------- vision / mission ---------- */
.vision-wrap{position:relative;padding:110px 0;overflow:hidden;}
.vision-grid{
  position:relative;z-index:1;
  display:grid;grid-template-columns:1fr 1fr;
  gap:56px;
}
.vision-col .vision-text{margin-top:16px;color:var(--chrome-dim);line-height:1.7;font-size:.98rem;}
.vision-col .h-display{font-size:clamp(1.7rem,3.2vw,2.4rem);}

/* ---------- teknik / services ---------- */
.tech-video-card{
  position:relative;
  border-radius:var(--radius);
  overflow:hidden;
  height:340px;
  margin-bottom:52px;
  background:linear-gradient(160deg,#1c1e23,#0e0f12);
}
.tech-video-media{position:absolute;inset:0;}
.tech-video-media .bg-video{width:100%;height:100%;}
.tech-video-caption{
  position:absolute;left:0;right:0;bottom:0;
  padding:28px 30px;
  background:linear-gradient(0deg,rgba(0,0,0,.82),transparent);
  color:#fff;
}
.tech-video-caption p{margin:8px 0 0;max-width:52ch;color:#d9dadb;font-size:.92rem;line-height:1.55;}

.services-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
.service-card{
  background:#fff;
  border:1px solid var(--paper-line);
  border-radius:var(--radius);
  padding:26px;
}
.service-check{
  width:38px;height:38px;
  border-radius:50%;
  background:rgba(201,162,74,.14);
  color:var(--brass);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:16px;
}
.service-check svg{width:18px;height:18px;}
.service-card h3{margin:0 0 8px;font-size:1.05rem;}
.service-card p{margin:0;color:var(--paper-dim);font-size:.88rem;line-height:1.55;}

/* ---------- why / neden ---------- */
.section-media{position:relative;}
.why-grid{
  position:relative;z-index:1;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
}
.why-cell{
  background:rgba(244,245,243,.05);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:26px 22px;
  backdrop-filter:blur(4px);
}
.why-num{
  font-family:'Bebas Neue',sans-serif;
  font-size:2.6rem;
  color:var(--brass);
  line-height:1;
}
.why-icon{width:30px;height:30px;color:var(--brass);margin-bottom:6px;}
.why-cell h4{margin:12px 0 6px;font-size:1rem;}
.why-cell p{margin:0;color:var(--chrome-dim);font-size:.86rem;line-height:1.5;}

/* ---------- team ---------- */
.team-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:22px;
}
.team-card{
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:26px;
  background:var(--ink-2);
  transition:transform .35s var(--ease),border-color .35s var(--ease);
}
.team-card:hover{transform:translateY(-4px);border-color:var(--brass);}
.team-top{display:flex;align-items:center;gap:14px;margin-bottom:16px;}
.team-avatar{
  width:52px;height:52px;border-radius:50%;
  background:linear-gradient(135deg,var(--brass-2),var(--brass));
  color:#171205;
  display:flex;align-items:center;justify-content:center;
  font-family:'Bebas Neue',sans-serif;font-size:1.15rem;letter-spacing:.02em;
  flex:none;
}
.team-name{font-weight:600;font-size:1rem;}
.team-role{color:var(--chrome-dim);font-size:.8rem;margin-top:2px;}
.team-phone{
  font-family:'IBM Plex Mono',monospace;
  color:var(--brass-2);
  margin-bottom:16px;
  font-size:.95rem;
}
.team-actions{display:flex;gap:10px;flex-wrap:wrap;}

/* ---------- konum ---------- */
.location-wrap{
  position:relative;z-index:1;
  display:grid;
  grid-template-columns:1fr 1.3fr;
  gap:32px;
  align-items:stretch;
}
.addr-card{
  background:#fff;
  border:1px solid var(--paper-line);
  border-radius:var(--radius);
  padding:28px;
  display:flex;flex-direction:column;gap:18px;
  justify-content:center;
}
.map-frame{
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--paper-line);
  min-height:320px;
}
.map-frame iframe{width:100%;height:100%;min-height:320px;border:0;display:block;}

/* ---------- footer ---------- */
footer{
  background:var(--ink-2);
  border-top:1px solid var(--line);
  padding:64px 0 0;
}
.foot-top{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:40px;
  padding-bottom:44px;
}
.foot-col h5{
  margin:0 0 16px;
  font-size:.78rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--chrome-dim);
}
.foot-links{display:flex;flex-direction:column;gap:10px;}
.foot-links a,.foot-links span{font-size:.9rem;color:var(--chrome-dim);}
.foot-links a:hover{color:var(--brass);}
.foot-social{display:flex;gap:10px;margin-top:18px;}
.icon-btn{
  width:38px;height:38px;border-radius:50%;
  border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
  transition:border-color .25s var(--ease),color .25s var(--ease);
}
.icon-btn svg{width:17px;height:17px;}
.icon-btn:hover{border-color:var(--brass);color:var(--brass);}
.foot-bottom{
  border-top:1px solid var(--line);
  padding:20px 0 26px;
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:8px;
  font-size:.78rem;
  color:var(--chrome-dim);
}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .nav-links{display:none;}
  .menu-btn{display:flex;}
  .contact-wrap{grid-template-columns:1fr;}
  .vision-grid{grid-template-columns:1fr;gap:40px;}
  .services-grid{grid-template-columns:repeat(2,1fr);}
  .why-grid{grid-template-columns:repeat(2,1fr);}
  .team-grid{grid-template-columns:1fr;}
  .location-wrap{grid-template-columns:1fr;}
  .foot-top{grid-template-columns:1fr;gap:32px;}
}

/* ----- tablet / large phone ----- */
@media (max-width:768px){
  .container{padding:0 20px;max-width:100%;}
  .nav{
    padding-left:calc(20px + env(safe-area-inset-left, 0px));
    padding-right:calc(20px + env(safe-area-inset-right, 0px));
  }
  .btn-wa-nav{display:none;}
  .plate-name{font-size:1.5rem;}
  .hero h1.h-display{font-size:clamp(2.6rem,11vw,4.6rem);}
  .hero-content{padding-left:20px;padding-right:20px;}
  .hero-sub{max-width:38ch;}
  .section{padding:68px 0;}
  .vision-wrap{padding:68px 0;}
  .tech-video-card{height:260px;}
  .why-num{font-size:2.2rem;}
}

/* ----- small phone (iPhone SE/13/14/15/Pro Max etc.) ----- */
@media (max-width:480px){
  .services-grid{grid-template-columns:1fr;}
  .why-grid{grid-template-columns:1fr;}

  .container{padding:0 16px;}
  .nav{
    padding-left:calc(14px + env(safe-area-inset-left, 0px));
    padding-right:calc(14px + env(safe-area-inset-right, 0px));
    gap:8px;
  }
  .nav-right{gap:10px;}
  .plate-name{font-size:1.2rem;}
  .plate-sub{font-size:.5rem;letter-spacing:.18em;}
  .menu-btn{width:38px;height:38px;flex:none;}

  .drawer{padding:8px 16px 22px;}

  .hero-content{padding-left:16px;padding-right:16px;}
  .hero h1.h-display{font-size:clamp(2.2rem,10vw,3.4rem);}
  .hero-slogan{font-size:.88rem;}
  .hero-sub{font-size:.88rem;max-width:34ch;}

  .btn{padding:12px 18px;font-size:.82rem;}
  .btn-row{flex-direction:column;width:100%;align-items:stretch;}
  .btn-row .btn{width:100%;justify-content:center;}

  .section{padding:52px 0;}
  .vision-wrap{padding:52px 0;}
  .section-head{margin-bottom:34px;}

  .contact-info,.contact-form,.addr-card{padding:20px;}
  .form-field input,.form-field textarea{padding:11px 13px;}
  .contact-form .btn{width:100%;justify-content:center;}

  .tech-video-card{height:200px;margin-bottom:36px;}
  .tech-video-caption{padding:18px;}
  .services-grid{gap:14px;}
  .service-card{padding:20px;}

  .why-grid{gap:14px;}
  .why-cell{padding:20px 18px;}
  .why-num{font-size:2rem;}

  .team-grid{gap:14px;}
  .team-card{padding:20px;}
  .team-actions{gap:8px;}

  .map-frame,.map-frame iframe{min-height:220px;}

  .foot-top{padding-bottom:32px;gap:28px;}
  .foot-bottom{flex-direction:column;align-items:flex-start;gap:6px;}

  .wa-float{width:50px;height:50px;}
  .wa-float svg{width:24px;height:24px;}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .reveal{opacity:1;transform:none;transition:none;}
  .wa-float{animation:none;}
  .scroll-cue .stick{animation:none;}
}
