/* ===========================================================
   Tekirdağ Akademik Odalar Birliği — Çok Yakında
   =========================================================== */

:root{
  --ink:          #060d18;
  --ink-2:        #0a1526;
  --line:         rgba(214, 226, 240, .10);
  --line-soft:    rgba(214, 226, 240, .055);

  --text:         #e8eef6;
  --text-dim:     #93a5bb;
  --text-faint:   #63758c;

  --gold:         #d8b36a;
  --gold-soft:    #f0dcae;
  --gold-deep:    #a8823c;
  --sea:          #4d9fb0;

  --panel-bg:     linear-gradient(155deg, rgba(255,255,255,.055), rgba(255,255,255,.014) 46%, rgba(216,179,106,.045));

  --f-display:    "Bodoni Moda", "Times New Roman", serif;
  --f-sans:       "Manrope", "Segoe UI", system-ui, -apple-system, sans-serif;

  --pad:          clamp(20px, 4vw, 58px);
  --ease:         cubic-bezier(.22,.61,.36,1);
  --ease-out:     cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{ box-sizing:border-box; }

html{
  -webkit-text-size-adjust:100%;
  background:
    radial-gradient(120% 85% at 78% 8%,  rgba(216,179,106,.14), transparent 58%),
    radial-gradient(95% 70% at 8% 96%,   rgba(77,159,176,.13),  transparent 62%),
    linear-gradient(180deg, #071120 0%, #060d18 46%, #04080f 100%)
    var(--ink) fixed;
}

body{
  margin:0;
  min-height:100vh;
  min-height:100svh;
  background:transparent;
  color:var(--text);
  font-family:var(--f-sans);
  font-weight:400;
  font-size:16px;
  line-height:1.6;
  letter-spacing:.005em;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; }
ul{ margin:0; padding:0; list-style:none; }
p{ margin:0; }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

.svg-sprite{ position:absolute; width:0; height:0; overflow:hidden; }

::selection{ background:rgba(216,179,106,.28); color:#fff; }

/* ---------- Arka plan katmanları ---------- */

.bg-canvas{
  position:fixed; inset:0;
  width:100%; height:100%;
  z-index:-3; pointer-events:none;
  opacity:0; transition:opacity 1.6s ease 0.15s;
}
.is-ready .bg-canvas{ opacity:1; }

.bg-aura{
  position:fixed; top:0; left:0;
  width:760px; height:760px; margin:-380px 0 0 -380px;
  z-index:-2; pointer-events:none;
  background:radial-gradient(circle, rgba(216,179,106,.13), rgba(216,179,106,.045) 38%, transparent 66%);
  transform:translate3d(50vw,45vh,0);
  transition:opacity .6s ease;
  opacity:0;
}
.is-ready .bg-aura{ opacity:1; }

.bg-grain{
  position:fixed; inset:-25%;
  z-index:-1; pointer-events:none; opacity:.30;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
  animation:grain 6s steps(6) infinite;
}
@keyframes grain{
  0%{ transform:translate(0,0) }        16%{ transform:translate(-6%,-4%) }
  33%{ transform:translate(4%,-7%) }    50%{ transform:translate(-5%,5%) }
  66%{ transform:translate(6%,3%) }     83%{ transform:translate(-3%,-6%) }
  100%{ transform:translate(0,0) }
}

.bg-vignette{
  position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(115% 95% at 50% 42%, transparent 45%, rgba(2,5,10,.55) 100%);
}

/* ---------- Açılış perdesi ---------- */

.loader{
  position:fixed; inset:0; z-index:120;
  display:grid; place-items:center;
  background:#050b14;
  transition:clip-path 1.05s var(--ease-out), opacity .4s ease .75s;
  clip-path:inset(0 0 0 0);
}
.loader.is-done{ clip-path:inset(0 0 100% 0); opacity:0; pointer-events:none; }

.loader__inner{ width:min(340px, 72vw); text-align:center; }

.loader__label{
  display:block;
  font-size:10.5px; letter-spacing:.36em; text-transform:uppercase;
  color:var(--text-faint);
}
.loader__bar{
  margin:20px 0 12px;
  height:1px; background:rgba(232,238,246,.13); overflow:hidden;
}
.loader__bar i{
  display:block; height:100%; width:0%;
  background:linear-gradient(90deg, var(--gold-deep), var(--gold-soft));
  transition:width .28s linear;
}
.loader__count{
  font-family:var(--f-display);
  font-size:13px; color:var(--gold); letter-spacing:.14em;
  font-variant-numeric:tabular-nums;
}

/* ---------- İskelet ---------- */

.shell{
  position:relative; z-index:2;
  min-height:100svh;
  display:flex; flex-direction:column;
  padding:clamp(18px, 3vw, 34px) var(--pad) clamp(14px, 2vw, 22px);
  max-width:1560px; margin:0 auto;
}

/* ---------- Üst bar ---------- */

.topbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; padding-bottom:clamp(18px, 3vh, 38px);
}

.brand{ display:flex; align-items:center; gap:14px; }

.brand__crest{
  width:42px; height:42px; flex:none;
  color:var(--gold);
  opacity:.92;
}
.brand__crest .crest__ring circle{ stroke-dasharray:3 7; }

.brand__text{ display:flex; flex-direction:column; line-height:1.22; }
.brand__text strong{
  font-weight:600; font-size:12.5px;
  letter-spacing:.185em; text-transform:uppercase;
}
.brand__text em{
  font-style:normal; font-size:12.5px; font-weight:400;
  letter-spacing:.185em; text-transform:uppercase; color:var(--text-faint);
}

.topbar__side{ display:flex; align-items:center; gap:clamp(14px, 2vw, 26px); }

.status{
  display:inline-flex; align-items:center; gap:9px;
  padding:7px 15px 7px 12px;
  border:1px solid rgba(216,179,106,.24);
  border-radius:100px;
  background:rgba(216,179,106,.055);
  font-size:11.5px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--gold-soft);
  white-space:nowrap;
}
.status__dot{
  width:6px; height:6px; border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 0 0 rgba(216,179,106,.55);
  animation:pulse 2.4s var(--ease) infinite;
}
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(216,179,106,.5) }
  70%{ box-shadow:0 0 0 9px rgba(216,179,106,0) }
  100%{ box-shadow:0 0 0 0 rgba(216,179,106,0) }
}

.topbar__mail{
  display:inline-flex; align-items:center; gap:9px;
  font-size:13.5px; color:var(--text-dim);
  transition:color .35s var(--ease);
}
.topbar__mail svg{
  width:17px; height:17px; fill:none;
  stroke:currentColor; stroke-width:1.35; stroke-linecap:round; stroke-linejoin:round;
  opacity:.75;
}
.topbar__mail span{
  position:relative;
  background-image:linear-gradient(currentColor, currentColor);
  background-size:0% 1px; background-repeat:no-repeat; background-position:0 100%;
  transition:background-size .45s var(--ease-out);
  padding-bottom:2px;
}
.topbar__mail:hover{ color:var(--gold-soft); }
.topbar__mail:hover span{ background-size:100% 1px; }

/* ---------- Hero ---------- */

.hero{
  flex:1;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:clamp(34px, 5vw, 86px);
  align-items:center;
  padding:0 0 clamp(20px, 3vh, 38px);
}

.hero__lead{ max-width:730px; }

.eyebrow{
  display:flex; align-items:center; gap:14px;
  font-size:11.5px; letter-spacing:.3em; text-transform:uppercase;
  color:var(--text-faint);
  margin-bottom:clamp(18px, 2.4vh, 28px);
}
.eyebrow__rule{
  display:block; width:clamp(28px, 5vw, 62px); height:1px;
  background:linear-gradient(90deg, var(--gold), rgba(216,179,106,0));
}

/* Başlık */
.title{
  margin:0;
  font-family:var(--f-display);
  font-weight:400;
  font-size:clamp(2.2rem, min(5.4vw, 7.6vh), 5rem);
  line-height:1.07;
  letter-spacing:-.018em;
}
.title .line{ display:block; }
.title .word{                       /* alt uzantılar (ğ, ç, ı) kırpılmasın */
  display:inline-block; overflow:hidden; vertical-align:bottom;
  padding-bottom:.2em; margin-bottom:-.2em;
}
.title .word > span{
  display:inline-block;
  transform:translateY(115%);
  transition:transform 1.15s var(--ease-out);
}
.is-ready .title .word > span{ transform:translateY(0); }
.title .line:nth-child(1) .word:nth-child(1) > span{ transition-delay:.06s }
.title .line:nth-child(1) .word:nth-child(2) > span{ transition-delay:.13s }
.title .line:nth-child(2) .word:nth-child(1) > span{ transition-delay:.20s }
.title .line:nth-child(2) .word:nth-child(2) > span{ transition-delay:.27s }
.title .line:nth-child(3) .word:nth-child(1) > span{ transition-delay:.34s }
.title .line:nth-child(3) .word:nth-child(2) > span{ transition-delay:.41s }

.word--accent > span{
  font-style:italic;
  background:linear-gradient(94deg, var(--gold-soft) 8%, var(--gold) 52%, var(--gold-deep) 96%);
  -webkit-background-clip:text; background-clip:text;
  color:transparent;
}

.lede{
  max-width:54ch;
  margin-top:clamp(16px, 2.2vh, 26px);
  font-size:clamp(14.5px, 1.08vw, 16.5px);
  font-weight:300;
  line-height:1.66;
  color:var(--text-dim);
}

/* Bildirim formu */
.notify{ margin-top:clamp(20px, 2.8vh, 32px); max-width:520px; }

.notify__field{
  display:flex; align-items:center; gap:8px;
  padding:7px 7px 7px 20px;
  border:1px solid var(--line);
  border-radius:100px;
  background:rgba(255,255,255,.028);
  backdrop-filter:blur(10px);
  transition:border-color .4s var(--ease), background .4s var(--ease), box-shadow .4s var(--ease);
}
.notify__field:focus-within{
  border-color:rgba(216,179,106,.45);
  background:rgba(255,255,255,.05);
  box-shadow:0 0 0 5px rgba(216,179,106,.07);
}
.notify.is-error .notify__field{ border-color:rgba(224,110,110,.5); }
.notify.is-error .notify__field{ animation:shake .45s var(--ease); }
@keyframes shake{
  0%,100%{ transform:translateX(0) }  22%{ transform:translateX(-6px) }
  46%{ transform:translateX(5px) }    72%{ transform:translateX(-3px) }
}

.notify input{
  flex:1; min-width:0;
  border:0; outline:0; background:transparent;
  color:var(--text);
  font-family:inherit; font-size:15px; letter-spacing:.01em;
  padding:10px 0;
}
.notify input::placeholder{ color:var(--text-faint); }

.btn{
  display:inline-flex; align-items:center; gap:10px;
  flex:none;
  padding:13px 20px 13px 24px;
  border:0; border-radius:100px;
  background:linear-gradient(100deg, var(--gold-soft), var(--gold) 46%, var(--gold-deep));
  color:#1a1206;
  font-size:13.5px; font-weight:700; letter-spacing:.045em;
  cursor:pointer;
  position:relative; overflow:hidden;
  transition:transform .45s var(--ease-out), box-shadow .45s var(--ease);
  box-shadow:0 10px 26px -12px rgba(216,179,106,.75);
}
.btn::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(100deg, transparent 22%, rgba(255,255,255,.6) 48%, transparent 74%);
  transform:translateX(-120%);
  transition:transform .85s var(--ease-out);
}
.btn:hover::after{ transform:translateX(120%); }
.btn:hover{ box-shadow:0 16px 34px -12px rgba(216,179,106,.85); }
.btn:active{ transform:scale(.975); }
.btn svg{
  width:16px; height:16px; fill:none;
  stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;
  transition:transform .45s var(--ease-out);
}
.btn:hover svg{ transform:translateX(3px); }

.notify__note{
  margin-top:14px; padding-left:20px;
  font-size:12.5px; line-height:1.55; color:var(--text-faint);
  transition:color .35s ease;
}
.notify.is-error .notify__note{ color:#e08b8b; }
.notify.is-ok .notify__note{ color:var(--gold-soft); }

/* İstatistik satırı */
.stats{
  display:flex; flex-wrap:wrap;
  gap:clamp(20px, 3.4vw, 52px);
  margin-top:clamp(22px, 3.2vh, 40px);
  padding-top:clamp(16px, 2.2vh, 26px);
  border-top:1px solid var(--line-soft);
}
.stats li{ display:flex; flex-direction:column; gap:3px; }
.stats b{
  font-family:var(--f-display);
  font-size:clamp(1.55rem, 2.5vw, 2.15rem);
  font-weight:500; line-height:1;
  color:var(--text);
  font-variant-numeric:tabular-nums;
}
.stats b i{ font-style:normal; color:var(--gold); font-size:.7em; vertical-align:top; }
.stats span{
  font-size:11px; letter-spacing:.17em; text-transform:uppercase;
  color:var(--text-faint);
}

/* ---------- Sağ panel ---------- */

.panel{
  position:relative;
  padding:clamp(24px, 2.6vw, 38px) clamp(22px, 2.4vw, 36px) clamp(22px, 2.4vw, 32px);
  border:1px solid var(--line);
  border-radius:26px;
  background:var(--panel-bg);
  backdrop-filter:blur(16px);
  box-shadow:0 40px 90px -50px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.06);
  text-align:center;
  overflow:hidden;
}
.panel::before{                    /* üstte ince altın çizgi */
  content:""; position:absolute; top:0; left:14%; right:14%; height:1px;
  background:linear-gradient(90deg, transparent, rgba(216,179,106,.6), transparent);
}

.panel__emblem{
  position:relative;
  width:clamp(104px, min(10.5vw, 15vh), 142px);
  height:clamp(104px, min(10.5vw, 15vh), 142px);
  margin:0 auto clamp(16px, 2vw, 26px);
  display:grid; place-items:center;
}
.emblem{
  position:relative; z-index:2;
  width:100%; height:100%;
  color:var(--gold);
  filter:drop-shadow(0 6px 24px rgba(216,179,106,.28));
}
.emblem-orbit{
  position:absolute; inset:-13%;
  fill:none; stroke:rgba(216,179,106,.34); stroke-width:.7;
  stroke-dasharray:2 10; stroke-linecap:round;
  animation:spin 46s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg) } }

/* Amblem çizim stilleri (sembol içinden) */
.crest__ring circle{ fill:none; stroke:currentColor; stroke-width:1; opacity:.42; }
.crest__inner{ fill:none; stroke:currentColor; stroke-width:.7; opacity:.2; }
.crest__nodes circle{ fill:currentColor; opacity:.55; }
.crest__nodes circle:nth-child(3n){ opacity:.95; }
.crest__mark path{
  fill:none; stroke:currentColor; stroke-width:3.4;
  stroke-linecap:round; stroke-linejoin:round;
}

.panel__kicker{
  font-size:10.5px; letter-spacing:.32em; text-transform:uppercase;
  color:var(--text-faint);
}

.countdown{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:clamp(6px, .8vw, 12px);
  margin:16px 0 14px;
}
.cd{
  padding:clamp(10px,1.2vw,15px) 4px clamp(8px,1vw,11px);
  border:1px solid var(--line-soft);
  border-radius:14px;
  background:rgba(255,255,255,.028);
}
.cd b{
  display:block;
  font-family:var(--f-display); font-weight:500;
  font-size:clamp(1.55rem, 2.6vw, 2.35rem);
  line-height:1; color:var(--text);
  font-variant-numeric:tabular-nums;
}
.cd b.is-tick{ animation:tick .5s var(--ease-out); }
@keyframes tick{
  0%{ transform:translateY(-38%); opacity:0; filter:blur(3px) }
  100%{ transform:translateY(0); opacity:1; filter:blur(0) }
}
.cd span{
  display:block; margin-top:7px;
  font-size:9.5px; letter-spacing:.19em; text-transform:uppercase;
  color:var(--text-faint);
}

.panel__date{
  font-size:12px; letter-spacing:.06em; color:var(--text-dim);
  padding-bottom:clamp(20px, 2.4vw, 28px);
  border-bottom:1px solid var(--line-soft);
}

.progress{ margin-top:clamp(18px, 2.2vw, 24px); text-align:left; }
.progress__head{
  display:flex; justify-content:space-between; align-items:baseline;
  font-size:11px; letter-spacing:.15em; text-transform:uppercase;
  color:var(--text-faint);
  margin-bottom:10px;
}
.progress__head b{
  font-family:var(--f-display); font-size:14px; letter-spacing:.04em;
  color:var(--gold-soft); font-variant-numeric:tabular-nums;
}
.progress__track{
  height:2px; border-radius:2px;
  background:rgba(232,238,246,.09); overflow:hidden;
}
.progress__track i{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg, var(--gold-deep), var(--gold-soft));
  box-shadow:0 0 12px rgba(216,179,106,.5);
  transition:width 1.9s var(--ease-out) .55s;
}

/* ---------- Odalar şeridi ---------- */

.ticker{
  position:relative;
  padding:clamp(14px, 1.8vh, 20px) 0;
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
  overflow:hidden;
  mask-image:linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent);
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent);
}
.ticker__track{ display:flex; width:max-content; animation:marquee 64s linear infinite; }
.ticker:hover .ticker__track{ animation-play-state:paused; }
@keyframes marquee{ to{ transform:translateX(-50%) } }

.ticker__row{ display:flex; align-items:center; }
.ticker__row span{
  padding:0 clamp(14px, 1.4vw, 22px);
  font-size:12px; letter-spacing:.19em; text-transform:uppercase;
  color:var(--text-faint);
  white-space:nowrap;
  transition:color .4s var(--ease);
}
.ticker:hover .ticker__row span:hover{ color:var(--gold-soft); }
.ticker__row i{
  width:4px; height:4px; flex:none;
  border-radius:50%; background:rgba(216,179,106,.45);
}

/* ---------- Alt bar ---------- */

.footbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:18px; flex-wrap:wrap;
  padding-top:clamp(14px, 2vh, 20px);
  font-size:12px; color:var(--text-faint);
}
.footbar__addr{ display:inline-flex; align-items:center; gap:8px; }
.footbar__addr svg{
  width:15px; height:15px; fill:none; stroke:currentColor;
  stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round; opacity:.7;
}

.social{ display:flex; gap:8px; }
.social a{
  display:grid; place-items:center;
  width:34px; height:34px;
  border:1px solid var(--line); border-radius:50%;
  transition:border-color .4s var(--ease), color .4s var(--ease),
             background .4s var(--ease), transform .4s var(--ease-out);
}
.social svg{
  width:15px; height:15px; fill:none; stroke:currentColor;
  stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round;
}
.social a:hover{
  color:var(--gold-soft);
  border-color:rgba(216,179,106,.45);
  background:rgba(216,179,106,.08);
  transform:translateY(-2px);
}

/* ---------- Giriş animasyonları ---------- */

[data-reveal]{
  opacity:0; transform:translateY(24px);
  transition:opacity 1s var(--ease-out), transform 1s var(--ease-out);
}
.is-ready [data-reveal]{ opacity:1; transform:none; }
.is-ready .eyebrow{ transition-delay:.05s }
.is-ready .lede{ transition-delay:.52s }
.is-ready .notify{ transition-delay:.62s }
.is-ready .stats{ transition-delay:.72s }
.is-ready .panel{ transition-delay:.40s }

.ticker, .footbar{
  opacity:0; transition:opacity 1.2s ease .9s;
}
.is-ready .ticker, .is-ready .footbar{ opacity:1; }

/* ---------- Duyarlı düzen ---------- */

@media (max-width:1100px){
  .hero{ grid-template-columns:1fr; gap:38px; padding-top:6px; }
  .panel{ max-width:520px; }
  .hero__lead{ max-width:none; }
}

@media (max-width:760px){
  /* Mobilde sıralama: başlık → özet → geri sayım → form → sayılar */
  .hero{ gap:0; }
  .hero__lead{ display:contents; }
  .eyebrow{ order:1 }
  .title{ order:2 }
  .lede{ order:3 }
  .panel{ order:4; margin-top:clamp(24px, 4vh, 34px); max-width:none; }
  .notify{ order:5; max-width:none; }
  .stats{ order:6 }

  .topbar{ flex-direction:column; align-items:flex-start; gap:16px; }
  .topbar__side{ width:100%; justify-content:space-between; }
  .topbar__mail span{ display:none; }
  .brand__crest{ width:38px; height:38px; }
  .brand__text strong, .brand__text em{ font-size:11px; letter-spacing:.16em; }

  .title{ font-size:clamp(2.2rem, 10.5vw, 3.4rem); }
  .notify__field{ flex-direction:column; align-items:stretch; gap:10px; padding:14px; border-radius:20px; }
  .notify input{ padding:6px 8px; text-align:center; }
  .btn{ justify-content:center; padding:14px 20px; }
  .notify__note{ padding-left:0; text-align:center; }

  .stats{ gap:18px 30px; }
  .stats li{ min-width:calc(50% - 30px); }

  .panel{ border-radius:22px; }
  .cd b{ font-size:1.7rem; }

  .footbar{ justify-content:center; text-align:center; gap:12px; }
  .footbar__copy{ order:3; width:100%; }
}

@media (max-width:400px){
  .countdown{ gap:5px; }
  .cd{ padding:10px 2px 8px; border-radius:11px; }
  .cd span{ font-size:8.5px; letter-spacing:.12em; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .bg-grain{ animation:none; }
  .title .word > span{ transform:none; }
  [data-reveal]{ opacity:1; transform:none; }
}