:root{
  --navy:#071d33;
  --navy2:#0b2d4d;
  --blue:#1779e8;
  --ice:#67b9ff;
  --steel:#9aabba;
  --white:#fff;
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#071d33;color:#fff}
a{color:inherit;text-decoration:none}button{font:inherit}
body{overflow:hidden}

.portal{position:relative;width:100vw;height:100svh;min-height:650px;overflow:hidden;background:#eaf2f7}
.portal::before{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(90deg,rgba(6,25,45,.12),transparent 26%,transparent 74%,rgba(6,25,45,.12)),radial-gradient(circle at 50% 34%,rgba(255,255,255,.96) 0 11%,rgba(255,255,255,.54) 27%,transparent 47%)}

.portal-head{position:absolute;z-index:30;top:0;left:0;right:0;height:88px;padding:0 clamp(24px,4vw,72px);display:flex;align-items:center;justify-content:space-between;color:#092945;background:linear-gradient(180deg,rgba(249,252,254,.94),rgba(249,252,254,.66) 62%,transparent)}
.portal-logo{display:flex;align-items:center;gap:10px}
.portal-logo>b{font-family:"Space Grotesk";font-size:39px;line-height:1;letter-spacing:-.09em}
.portal-logo span{font-size:7px;line-height:1.25;letter-spacing:.23em;font-weight:800}
.portal-head nav{display:flex;align-items:center;gap:30px;font-size:10px;font-weight:800;letter-spacing:.12em}
.portal-head nav a{opacity:.76;transition:.25s}.portal-head nav a:hover{opacity:1;color:var(--blue)}
.lang{border:1px solid rgba(9,41,69,.14);background:rgba(255,255,255,.82);color:#092945;border-radius:999px;padding:8px 12px;font-size:9px;font-weight:700;display:flex;align-items:center;gap:8px}.lang i{width:1px;height:11px;background:#a8b5c0}.lang span{opacity:.5}

.hero-copy{position:absolute;z-index:20;top:13.5%;left:50%;transform:translateX(-50%);width:min(760px,78vw);text-align:center;color:#082947;pointer-events:none}
.hero-copy p{margin:0 0 9px;font-size:9px;font-weight:800;letter-spacing:.34em}
.hero-copy h1{margin:0;font-family:"Space Grotesk";font-size:clamp(38px,4vw,68px);line-height:.93;letter-spacing:-.06em}
.hero-copy h1 em{font-style:normal;color:var(--blue)}
.hero-copy>span{display:inline-block;margin-top:14px;font-size:11px;color:#5f788d;padding-bottom:8px;border-bottom:2px solid transparent;border-image:linear-gradient(90deg,var(--blue),#bdd7eb) 1}

.technology-grid{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr}
.technology{position:relative;overflow:hidden;isolation:isolate;outline:none}
.technology__media{position:absolute;inset:0;background-repeat:no-repeat;background-size:cover;transition:transform 1.1s var(--ease),filter .7s var(--ease)}
.technology--iceberg .technology__media{background-image:url('../images/portal-iceberg-clean.jpg');background-position:center 52%;filter:saturate(.95) contrast(1.04)}
.technology--process .technology__media{background-image:url('../images/portal-process-clean.jpg');background-position:center 52%;filter:none}
.technology__veil{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(239,247,252,.32) 0%,rgba(255,255,255,.03) 38%,rgba(3,24,44,.22) 72%,rgba(3,20,38,.48) 100%);transition:.6s var(--ease)}
.technology--process .technology__veil{background:linear-gradient(to bottom,rgba(239,247,252,.36),rgba(255,255,255,.05) 38%,rgba(10,38,64,.24) 72%,rgba(5,28,49,.52) 100%)}
.technology__glow{position:absolute;width:62%;height:120%;top:-10%;opacity:.17;filter:blur(65px);pointer-events:none;transition:.7s var(--ease)}
.technology--iceberg .technology__glow{left:-28%;background:linear-gradient(90deg,var(--blue),transparent)}
.technology--process .technology__glow{right:-28%;background:linear-gradient(270deg,#87a9c4,transparent)}
.technology:hover .technology__media,.technology:focus-visible .technology__media{transform:scale(1.045)}
.technology:hover .technology__veil,.technology:focus-visible .technology__veil{background-color:rgba(5,27,47,.05)}
.technology:hover .technology__glow,.technology:focus-visible .technology__glow{opacity:.38}

.technology__card{position:absolute;z-index:8;bottom:11.5%;width:min(390px,39vw);padding:24px 25px 23px;border-radius:22px;border:1px solid rgba(255,255,255,.42);background:linear-gradient(145deg,rgba(5,37,67,.88),rgba(8,30,51,.72));box-shadow:0 24px 70px rgba(2,18,34,.28);backdrop-filter:blur(18px);transition:transform .5s var(--ease),background .5s var(--ease)}
.technology--iceberg .technology__card{left:7%}
.technology--process .technology__card{right:7%;background:linear-gradient(145deg,rgba(12,45,72,.90),rgba(9,33,55,.76))}
.technology:hover .technology__card{transform:translateY(-8px)}
.technology__card small{font-size:8px;font-weight:800;letter-spacing:.24em;color:#dbeaf6}
.technology__card h2{font-family:"Space Grotesk";margin:8px 0 8px;font-size:clamp(35px,3.25vw,58px);line-height:.9;letter-spacing:-.06em}
.technology__card h2 em{font-style:normal;color:#4c9df2}
.technology__card p{margin:0 0 18px;max-width:330px;font-size:12px;line-height:1.55;color:rgba(255,255,255,.82)}
.technology__card strong{display:flex;align-items:center;gap:12px;width:max-content;font-size:9px;letter-spacing:.09em}
.technology__card strong b{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#fff;color:#0a3157;font-size:15px}

.technology-switch{position:absolute;z-index:24;left:50%;bottom:15.5%;transform:translateX(-50%);width:115px;height:115px;border-radius:50%;display:grid;grid-template-columns:repeat(3,6px);grid-template-rows:repeat(3,6px);gap:7px;justify-content:center;align-content:start;padding-top:25px;background:linear-gradient(145deg,rgba(8,48,81,.92),rgba(7,31,53,.86));border:1px solid rgba(255,255,255,.62);box-shadow:0 0 0 8px rgba(255,255,255,.08),0 0 42px rgba(38,134,234,.32);backdrop-filter:blur(15px);pointer-events:none}
.technology-switch i{width:6px;height:6px;border-radius:50%;background:#fff}
.technology-switch span{position:absolute;left:0;right:0;bottom:17px;text-align:center;font-size:8px;line-height:1.3;font-weight:800;letter-spacing:.06em}

.portal-stats{position:absolute;z-index:22;left:7.5%;right:7.5%;bottom:2.8%;min-height:73px;display:grid;grid-template-columns:repeat(4,1fr) 1.1fr;align-items:center;border:1px solid rgba(255,255,255,.34);border-radius:18px;background:rgba(5,32,55,.80);backdrop-filter:blur(18px);box-shadow:0 20px 55px rgba(3,21,38,.22);padding:0 20px}
.portal-stats>div{min-height:40px;padding:0 20px;display:flex;align-items:center;gap:9px;border-right:1px solid rgba(255,255,255,.18)}
.portal-stats>div b{font-size:18px}.portal-stats>div span{font-size:8px;line-height:1.35;letter-spacing:.08em;color:#d5e0e8}
.portal-stats>a{justify-self:end;display:flex;align-items:center;gap:22px;border:1px solid rgba(98,178,255,.5);padding:12px 18px;border-radius:12px;font-size:9px;font-weight:800;letter-spacing:.07em;transition:.3s}.portal-stats>a:hover{background:#1674e8;border-color:#1674e8}

.loader{position:fixed;inset:0;z-index:100;display:grid;place-content:center;text-align:center;background:linear-gradient(145deg,#f8fbfe,#dfeaf3);color:var(--navy);transition:opacity .7s var(--ease),visibility .7s}.loader.is-hidden{opacity:0;visibility:hidden}
.loader__mark{font-family:"Space Grotesk";font-weight:700;font-size:clamp(78px,10vw,150px);letter-spacing:-.08em;line-height:.8;background:linear-gradient(145deg,#fff,#7c8e9e 40%,#fff 58%,#647586);-webkit-background-clip:text;color:transparent;filter:drop-shadow(0 9px 12px rgba(0,39,76,.2))}.loader__caption{margin-top:24px;font-size:11px;font-weight:700;letter-spacing:.5em}.loader__track{width:220px;height:2px;margin:28px auto 0;background:rgba(11,41,71,.12);overflow:hidden}.loader__track i{display:block;width:35%;height:100%;background:linear-gradient(90deg,var(--blue),#90abc1);animation:load 1.25s infinite var(--ease)}
@keyframes load{from{transform:translateX(-120%)}to{transform:translateX(380%)}}

@media(max-width:1100px){
  .portal{min-height:620px}.hero-copy{top:14.5%}.technology__card{bottom:13%;padding:20px}.technology-switch{width:96px;height:96px;bottom:17%;padding-top:20px}.technology-switch span{bottom:12px}.portal-stats{left:3%;right:3%}.portal-stats>div{padding:0 12px}.portal-head nav{gap:18px}
}

@media(max-width:900px){
  body{overflow:auto;background:#edf4f8}.portal{height:auto;min-height:100svh;overflow:visible;padding-bottom:24px;background:#edf4f8}.portal::before{display:none}
  .portal-head{position:relative;height:74px;padding:0 18px;background:#f7fafc}.portal-head nav a{display:none}.portal-head nav{gap:0}.portal-logo>b{font-size:32px}.hero-copy{position:relative;top:auto;left:auto;transform:none;width:auto;padding:28px 20px 22px;text-align:left;background:#f7fafc}.hero-copy p{font-size:8px}.hero-copy h1{font-size:clamp(38px,10.5vw,56px);line-height:.94}.hero-copy>span{font-size:12px}
  .technology-grid{position:relative;inset:auto;display:grid;grid-template-columns:1fr;gap:14px;padding:0 14px}.technology{height:430px;border-radius:26px;box-shadow:0 22px 50px rgba(8,39,66,.15)}.technology__media{background-size:cover}.technology--iceberg .technology__media{background-position:center center}.technology--process .technology__media{background-position:center center}.technology__veil{background:linear-gradient(to top,rgba(4,25,44,.94) 2%,rgba(6,42,72,.28) 58%,rgba(255,255,255,.02) 88%)}.technology--process .technology__veil{background:linear-gradient(to top,rgba(5,29,50,.95) 2%,rgba(10,54,86,.30) 58%,rgba(255,255,255,.02) 88%)}
  .technology__card,.technology--iceberg .technology__card,.technology--process .technology__card{left:20px;right:20px;bottom:20px;width:auto;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none}.technology:hover .technology__card{transform:none}.technology__card h2{font-size:46px}.technology__card p{font-size:12px}.technology-switch,.portal-stats{display:none}
}

@media(max-width:480px){.technology{height:390px}.technology__card h2{font-size:40px}.hero-copy{padding-top:22px}.hero-copy h1{font-size:40px}.loader__caption{letter-spacing:.35em}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.loader{display:none}.technology__media{transform:none!important}}


/* =========================================================
   PORTAL 6.3 — CLEAN SOURCE FIX
   Arka plan görselleri artık fiziksel olarak temiz:
   gömülü yazı, kart, buton, FUTURE ve alt şerit yok.
   ========================================================= */

@media (min-width:901px){
  .portal{
    height:100vh;
    min-height:650px;
    background:#eef4f8;
  }

  .portal-head{
    height:88px;
    padding:0 3.5vw;
    background:rgba(248,251,253,.94);
    border-bottom:1px solid rgba(8,41,71,.07);
    backdrop-filter:blur(10px);
  }

  .hero-copy{
    top:12.8%;
    width:min(720px,70vw);
    padding:0;
    background:transparent;
    box-shadow:none;
  }

  .hero-copy h1{
    font-size:clamp(42px,4vw,66px);
    line-height:.94;
  }

  .technology-grid{
    top:88px;
    bottom:0;
  }

  .technology__media{
    background-size:cover;
    background-position:center center;
  }

  .technology--iceberg .technology__media{
    background-position:center 46%;
  }

  .technology--process .technology__media{
    background-position:center 45%;
    filter:none;
  }

  .technology__veil{
    background:linear-gradient(
      to bottom,
      rgba(246,250,253,.34) 0%,
      rgba(255,255,255,.03) 36%,
      rgba(4,28,49,.18) 70%,
      rgba(4,25,44,.50) 100%
    );
  }

  .technology--process .technology__veil{
    background:linear-gradient(
      to bottom,
      rgba(246,250,253,.36) 0%,
      rgba(255,255,255,.04) 36%,
      rgba(15,48,74,.20) 70%,
      rgba(6,31,53,.54) 100%
    );
  }

  .technology__card{
    bottom:13.5%;
    width:min(390px,37vw);
    min-height:0;
    padding:24px 26px 23px;
    background:linear-gradient(145deg,rgba(5,37,67,.92),rgba(8,30,51,.86));
    border:1px solid rgba(255,255,255,.42);
    border-radius:22px;
    backdrop-filter:blur(14px);
  }

  .technology--iceberg .technology__card{
    left:7%;
  }

  .technology--process .technology__card{
    right:7%;
    background:linear-gradient(145deg,rgba(12,45,72,.93),rgba(9,33,55,.88));
  }

  .technology__card h2{
    font-size:clamp(36px,3.1vw,54px);
  }

  .technology-switch{
    width:112px;
    height:112px;
    bottom:15.5%;
    padding-top:24px;
    background:linear-gradient(145deg,#0b3558,#082b4b);
    border:1px solid rgba(255,255,255,.60);
    box-shadow:0 0 0 8px rgba(255,255,255,.08),0 0 34px rgba(30,127,228,.30);
  }

  .technology-switch span{
    bottom:15px;
  }

  .portal-stats{
    left:7.5%;
    right:7.5%;
    bottom:2.8%;
    min-height:72px;
    border-radius:18px;
    background:rgba(5,32,55,.88);
    backdrop-filter:blur(16px);
  }
}

@media (max-width:900px){
  .technology--iceberg .technology__media{
    background-image:url('../images/portal-iceberg-clean.jpg');
  }
  .technology--process .technology__media{
    background-image:url('../images/portal-process-clean.jpg');
  }
}


/* =========================================================
   PORTAL 6.4 — VIDEO BACKGROUND
   Ana yerleşim korunur; yalnızca medya katmanı videoya döner.
   ========================================================= */

.technology__media{
  background:none !important;
  overflow:hidden;
}

.technology__video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  pointer-events:none;
  transform:scale(1.01);
  transition:transform 1.1s var(--ease),filter .6s var(--ease),opacity .35s ease;
  background:#0b2947;
}

.technology--iceberg .technology__video{
  object-position:center 48%;
  filter:saturate(.82) contrast(1.06) brightness(.88) hue-rotate(3deg);
}

.technology--process .technology__video{
  object-position:center 50%;
  filter:saturate(1) contrast(1.03) brightness(.90);
}

.technology:hover .technology__video,
.technology:focus-visible .technology__video{
  transform:scale(1.055);
}

/* Kurumsal mavi ton; yeşil kullanılmaz */
.technology--iceberg .technology__veil{
  background:linear-gradient(
    to bottom,
    rgba(226,242,253,.16) 0%,
    rgba(9,77,132,.10) 36%,
    rgba(4,34,60,.30) 70%,
    rgba(3,25,45,.62) 100%
  ) !important;
}

.technology--process .technology__veil{
  background:linear-gradient(
    to bottom,
    rgba(232,241,247,.13) 0%,
    rgba(23,57,82,.15) 38%,
    rgba(9,39,63,.34) 70%,
    rgba(4,27,47,.66) 100%
  ) !important;
}

.technology--iceberg .technology__glow{
  background:linear-gradient(90deg,#1674e8,transparent) !important;
}

.technology--process .technology__glow{
  background:linear-gradient(270deg,#6ea3c9,transparent) !important;
}

@media(max-width:900px){
  .technology__media{
    background:none !important;
  }
  .technology__video{
    transform:none;
  }
  .technology:hover .technology__video,
  .technology:focus-visible .technology__video{
    transform:none;
  }
}

@media(prefers-reduced-motion:reduce){
  .technology__video{
    display:none;
  }
  .technology--iceberg .technology__media{
    background:url('../images/portal-iceberg-clean.jpg') center/cover no-repeat !important;
  }
  .technology--process .technology__media{
    background:url('../images/portal-process-clean.jpg') center/cover no-repeat !important;
  }
}


/* =========================================================
   3H IQF REVİZYONU 6.5
   Sol taraf: buz mavisi kimlik + gerçek IQF makinesi +
   donma süreci görseli. Sağ 3H Makineler tarafına dokunulmadı.
   ========================================================= */

.technology--iceberg{
  background:#dff4ff;
}

.technology--iceberg .technology__media--iqf{
  background:none !important;
  filter:none !important;
  overflow:hidden;
}

.iqf-scene{
  position:absolute;
  inset:-3%;
  background-size:cover;
  background-position:center;
  opacity:0;
  transform:scale(1.04);
  will-change:opacity,transform;
}

.iqf-scene--machine{
  background-image:url('../images/iqf-machine-real.jpg');
  animation:iqfMachineCycle 14s infinite ease-in-out;
}

.iqf-scene--freeze{
  background-image:url('../images/iqf-freeze-progression.jpg');
  background-position:center center;
  animation:iqfFreezeCycle 14s infinite ease-in-out;
}

@keyframes iqfMachineCycle{
  0%,42%{opacity:1;transform:scale(1.04)}
  48%,92%{opacity:0;transform:scale(1.09)}
  96%,100%{opacity:1;transform:scale(1.04)}
}

@keyframes iqfFreezeCycle{
  0%,42%{opacity:0;transform:scale(1.10)}
  48%,92%{opacity:1;transform:scale(1.04)}
  96%,100%{opacity:0;transform:scale(1.10)}
}

.technology--iceberg .technology__veil{
  background:
    linear-gradient(to bottom,
      rgba(224,247,255,.46) 0%,
      rgba(164,224,255,.10) 38%,
      rgba(22,94,140,.20) 68%,
      rgba(4,37,64,.62) 100%) !important;
}

.technology--iceberg .technology__glow{
  left:-22%;
  width:76%;
  opacity:.24;
  background:linear-gradient(90deg,#bcecff 0%,#64c8ff 35%,rgba(49,147,221,.12) 76%,transparent 100%) !important;
}

.technology--iceberg .technology__card{
  background:linear-gradient(145deg,rgba(13,68,108,.93),rgba(5,38,67,.88)) !important;
  border-color:rgba(207,242,255,.52) !important;
  box-shadow:0 24px 70px rgba(2,42,72,.34),0 0 42px rgba(101,196,255,.10) !important;
}

.technology--iceberg .technology__card h2 em{
  color:#92ddff !important;
}

.iqf-frost{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.34;
  mix-blend-mode:screen;
  background:
    radial-gradient(circle at 12% 24%,rgba(255,255,255,.72) 0 1px,transparent 2px),
    radial-gradient(circle at 32% 14%,rgba(198,239,255,.65) 0 1px,transparent 2px),
    radial-gradient(circle at 68% 22%,rgba(255,255,255,.60) 0 1px,transparent 2px),
    radial-gradient(circle at 84% 38%,rgba(210,244,255,.65) 0 1.2px,transparent 2.2px),
    linear-gradient(115deg,rgba(255,255,255,.08),transparent 36%,rgba(147,221,255,.10) 68%,transparent);
  background-size:115px 115px,145px 145px,170px 170px,130px 130px,100% 100%;
  animation:iqfFrostDrift 11s linear infinite;
}

@keyframes iqfFrostDrift{
  from{background-position:0 0,20px 0,0 40px,30px 20px,0 0}
  to{background-position:30px 70px,-20px 80px,50px 110px,-20px 90px,0 0}
}

@media(max-width:900px){
  .iqf-scene{inset:0}
  .technology--iceberg .technology__card h2 em{color:#92ddff !important}
}

@media(prefers-reduced-motion:reduce){
  .iqf-scene--machine{opacity:1;animation:none}
  .iqf-scene--freeze,.iqf-frost{display:none}
}