/* ============================= TOKENS ============================= */
:root{
  --bg:#04161C; --surface:#0A2530; --surface-2:#082129; --border:#1C4652; --border-strong:#2A5C6B;
  --ink:#E8F3F1; --ink-soft:#B9D2CE; --muted:#7FA39D;
  --deep:#02171E; --deep-2:#052732; --deep-3:#08333F;
  --blue:#2E9CCB; --blue-strong:#57B4DC; --blue-bright:#57B4DC; --blue-soft:rgba(31,157,217,0.16);
  --signal:#6FCDBC; --signal-soft:rgba(106,198,183,0.18);
  --copper:#6FCDBC; --copper-soft:rgba(106,198,183,0.18);
  --accent:#57B4DC; --accent-strong:#84CBEA; --accent-soft:rgba(31,157,217,0.18);
  --line: rgba(87,180,220,0.08);
  --shadow-1: 0 1px 1px rgba(0,0,0,0.25), 0 4px 12px -6px rgba(0,0,0,0.45);
  --shadow-2: 0 8px 32px -12px rgba(0,0,0,0.35);
  --radius-s:2px; --radius-m:5px; --radius-l:8px;
  --font-display:'IBM Plex Sans Condensed','IBM Plex Sans',Arial,sans-serif;
  --font-body:'IBM Plex Sans',Arial,sans-serif;
  --font-mono:'IBM Plex Mono','Courier New',monospace;
  --font-hero:'Big Shoulders Display',var(--font-display);
  --container: 1240px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#04161C; --surface:#0A2530; --surface-2:#082129; --border:#1C4652; --border-strong:#2A5C6B;
    --ink:#E8F3F1; --ink-soft:#B9D2CE; --muted:#7FA39D;
    --deep:#02171E; --deep-2:#052732; --deep-3:#08333F;
    --blue:#2E9CCB; --blue-strong:#57B4DC; --blue-bright:#57B4DC; --blue-soft:rgba(31,157,217,0.16);
    --signal:#6FCDBC; --signal-soft:rgba(106,198,183,0.18);
    --copper:#6FCDBC; --copper-soft:rgba(106,198,183,0.18);
    --accent:#57B4DC; --accent-strong:#84CBEA; --accent-soft:rgba(31,157,217,0.18);
    --line: rgba(87,180,220,0.08);
    --shadow-1: 0 1px 1px rgba(0,0,0,0.25), 0 4px 12px -6px rgba(0,0,0,0.45);
  }
}
:root[data-theme="dark"]{
  --bg:#04161C; --surface:#0A2530; --surface-2:#082129; --border:#1C4652; --border-strong:#2A5C6B;
  --ink:#E8F3F1; --ink-soft:#B9D2CE; --muted:#7FA39D;
  --deep:#02171E; --deep-2:#052732; --deep-3:#08333F;
  --blue:#2E9CCB; --blue-strong:#57B4DC; --blue-bright:#57B4DC; --blue-soft:rgba(31,157,217,0.16);
  --signal:#6FCDBC; --signal-soft:rgba(106,198,183,0.18);
  --copper:#6FCDBC; --copper-soft:rgba(106,198,183,0.18);
  --accent:#57B4DC; --accent-strong:#84CBEA; --accent-soft:rgba(31,157,217,0.18);
  --line: rgba(87,180,220,0.08);
  --shadow-1: 0 1px 1px rgba(0,0,0,0.25), 0 4px 12px -6px rgba(0,0,0,0.45);
}

/* ============================= RESET / BASE ============================= */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;} }
body{ margin:0; background:var(--bg); color:var(--ink); font-family:var(--font-body); font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img{ max-width:100%; display:block; }
a{ color:inherit; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:700; color:var(--ink); text-wrap:balance; margin:0; }
p{ margin:0; }
::selection{ background:var(--signal); color:var(--deep); }
:focus-visible{ outline:2px solid var(--blue-bright); outline-offset:3px; border-radius:2px; }

.wrap{ max-width:var(--container); margin:0 auto; padding-left:clamp(1.2rem,4vw,3rem); padding-right:clamp(1.2rem,4vw,3rem); }
.section{ padding:clamp(4rem,9vw,7.5rem) 0; position:relative; }
.section.on-dark{ background:var(--deep-2); color:#EAF3F8; }
.section.on-deep{ background:var(--deep); color:#EAF3F8; }
.section.grid-bg{ background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size:34px 34px; }
.section-head{ max-width:640px; margin-bottom:clamp(2.4rem,5vw,3.6rem); }
.section-head.wide{ max-width:820px; }
.section-head .eyebrow{ margin-bottom:0.9rem; }
.section-head h2{ font-size:clamp(1.9rem,3.6vw,2.9rem); line-height:1.08; }
.section-head p{ color:var(--muted); font-size:1.05rem; margin-top:1rem; max-width:60ch; }
.on-dark h1, .on-dark h2, .on-dark h3, .on-dark h4,
.on-deep h1, .on-deep h2, .on-deep h3, .on-deep h4 { color:#EAF3F8; }
.on-dark .section-head p, .on-deep .section-head p{ color:#9FBACB; }

.eyebrow{ display:inline-flex; align-items:center; gap:0.6em; font-family:var(--font-mono); font-size:0.74rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--blue-strong); font-weight:500; }
.eyebrow::before{ content:""; width:22px; height:1px; background:currentColor; box-shadow:0 0 7px currentColor; }
.hg-accent{ color:#6AC6B7; text-shadow:0 0 26px rgba(106,198,183,0.55); }
.on-dark .eyebrow, .on-deep .eyebrow{ color:var(--blue-bright); }

.mono{ font-family:var(--font-mono); }
.num{ font-variant-numeric:tabular-nums; font-family:var(--font-mono); }

/* ============================= BUTTONS ============================= */
.btn{ font-family:var(--font-body); font-weight:600; font-size:0.95rem; padding:0.85rem 1.5rem; border-radius:var(--radius-s); border:1px solid transparent; cursor:pointer; display:inline-flex; align-items:center; gap:0.6rem; text-decoration:none; white-space:nowrap; transition:transform .15s ease, background .15s ease, border-color .15s ease; }
.btn:hover{ transform:translateY(-1px); }
.btn-primary{ background:var(--blue-bright); color:var(--deep); box-shadow:0 0 0 1px rgba(31,157,217,0.35), 0 10px 28px -8px rgba(31,157,217,0.65); }
.btn-primary:hover{ background:#4DB8E8; }
:root:not([data-theme="dark"]) .btn-primary{ background:var(--blue-strong); color:#fff; }
:root:not([data-theme="dark"]) .btn-primary:hover{ background:var(--blue); }
.btn-outline{ background:transparent; border-color:rgba(255,255,255,0.28); color:#EAF3F8; }
.btn-outline:hover{ border-color:#fff; }
.btn-ghost{ background:transparent; color:var(--blue-strong); padding-left:0.2rem; padding-right:0.2rem; gap:0.4rem; }
.on-dark .btn-ghost, .on-deep .btn-ghost{ color:var(--blue-bright); }
.btn-ghost svg{ transition:transform .15s ease; }
.btn-ghost:hover svg{ transform:translateX(3px); }
.btn-row{ display:flex; gap:1rem; flex-wrap:wrap; align-items:center; }

/* ============================= NAV ============================= */
.nav{ position:fixed; top:0; left:0; right:0; z-index:100; padding:1rem 0; transition:padding .25s ease, box-shadow .25s ease; background:rgba(1,56,73,0.96); backdrop-filter:blur(10px); border-bottom:1px solid rgba(255,255,255,0.08); }
.nav .wrap{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; }
.nav.scrolled{ padding:0.65rem 0; box-shadow:0 8px 24px -16px rgba(0,0,0,0.5); }
.brand{ display:flex; align-items:center; gap:0.65rem; text-decoration:none; flex-shrink:0; }
.brand .mk{ height:50px; width:auto; display:block; flex:0 0 auto; transition:height .25s ease; }
.nav.scrolled .brand .mk{ height:42px; }
.brand .wd{ font-family:var(--font-display); font-weight:700; font-size:1.6rem; letter-spacing:0.02em; color:#fff; }
.nav-links{ display:flex; gap:1.3rem; list-style:none; margin:0; padding:0; }
.nav-links a{ text-decoration:none; font-size:0.9rem; color:#C7D9E1; transition:color .15s ease; white-space:nowrap; }
.nav-links a:hover{ color:#fff; }
.nav-cta{ display:flex; align-items:center; gap:1.1rem; }
.nav-apps{ display:flex; align-items:center; gap:0.7rem; }
.nav-apps a{ display:flex; align-items:center; gap:0.4rem; text-decoration:none; font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.02em; color:#6AC6B7; transition:color .15s ease; white-space:nowrap; }
.nav-apps a:hover{ color:#fff; }
.nav-apps svg{ flex:0 0 auto; }
.nav-apps-tag{ display:none; }
.nav-apps-div{ width:1px; height:12px; background:rgba(255,255,255,0.22); display:inline-block; }
.lang-switch{ display:flex; align-items:center; gap:0.35rem; font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.02em; margin-left:0.3rem; }
.lang-switch a{ text-decoration:none; color:#8FAFC0; transition:color .15s ease; padding:0.2rem 0.1rem; }
.lang-switch a:hover{ color:#fff; }
.lang-switch a.is-active{ color:#fff; font-weight:600; pointer-events:none; }
.lang-switch .sep{ color:rgba(255,255,255,0.28); }
@media (max-width:640px){
  .lang-switch{ font-size:0.68rem; gap:0.3rem; }
  .lang-switch a{ padding:0.3rem 0.5rem; border:1px solid rgba(255,255,255,0.28); border-radius:99px; }
  .lang-switch a.is-active{ border-color:rgba(255,255,255,0.6); background:rgba(255,255,255,0.08); }
  .lang-switch .sep{ display:none; }
}
.has-dropdown{ position:relative; }
.has-dropdown > a{ display:inline-flex; align-items:center; gap:0.32rem; }
.has-dropdown .dd-caret{ transition:transform .2s ease; }
.has-dropdown:hover .dd-caret, .has-dropdown:focus-within .dd-caret{ transform:rotate(180deg); }
.has-dropdown::after{ content:""; position:absolute; top:100%; left:0; right:0; height:1rem; }
.nav-dropdown{ list-style:none; margin:0; padding:0.5rem; position:absolute; top:calc(100% + 0.9rem); left:50%; transform:translateX(-50%) translateY(-6px); min-width:228px; background:#04222C; border:1px solid rgba(255,255,255,0.12); border-radius:var(--radius-m); box-shadow:0 22px 44px -14px rgba(0,0,0,0.6); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .16s ease, visibility .16s ease, transform .16s ease; z-index:120; }
.has-dropdown:hover .nav-dropdown, .has-dropdown:focus-within .nav-dropdown{ opacity:1; visibility:visible; pointer-events:auto; transform:translateX(-50%) translateY(0); }
.nav-dropdown li{ opacity:0; transform:translateY(-8px); transition:opacity .3s ease, transform .3s ease; transition-delay:0s; }
.has-dropdown:hover .nav-dropdown li, .has-dropdown:focus-within .nav-dropdown li{ opacity:1; transform:translateY(0); transition-delay:calc(var(--i) * 0.07s); }
.nav-dropdown a{ display:flex; flex-direction:column; gap:0.15rem; padding:0.6rem 0.7rem; border-radius:var(--radius-s); text-decoration:none; }
.nav-dropdown a:hover{ background:rgba(255,255,255,0.07); }
.nav-dropdown a b{ font-size:0.86rem; color:#fff; font-weight:600; }
.nav-dropdown a span{ font-size:0.72rem; color:#8FB2BF; font-family:var(--font-mono); }
@media (max-width:1200px){
  .nav-dropdown{ position:static; opacity:1; visibility:visible; pointer-events:auto; transform:none; box-shadow:none; border:none; background:transparent; padding:0.2rem 0 0.2rem 1.1rem; margin-top:0.3rem; }
  .nav-dropdown li{ opacity:1; transform:none; }
  .has-dropdown::after{ display:none; }
  .has-dropdown .dd-caret{ display:none; }
}
.has-megamenu .mega-menu{ list-style:none; margin:0; padding:1.5rem; position:absolute; top:calc(100% + 0.9rem); left:50%; transform:translateX(-50%) translateY(-6px); width:min(880px, 94vw); background:#04222C; border:1px solid rgba(255,255,255,0.12); border-radius:var(--radius-m); box-shadow:0 22px 44px -14px rgba(0,0,0,0.6); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .16s ease, visibility .16s ease, transform .16s ease; z-index:120; display:grid; grid-template-columns:1fr 1fr 1.15fr 1.05fr; gap:1.4rem; }
@media (min-width:1201px){
  .has-megamenu.megamenu-compact .mega-menu{ grid-template-columns:1fr 1fr; width:min(740px,94vw); }
  .has-megamenu.megamenu-single .mega-menu{ grid-template-columns:1fr; width:min(400px,92vw); }
}
.has-megamenu:hover .mega-menu, .has-megamenu:focus-within .mega-menu{ opacity:1; visibility:visible; pointer-events:auto; transform:translateX(-50%) translateY(0); }
.mega-menu h5{ font-family:var(--font-mono); font-size:0.64rem; letter-spacing:0.08em; text-transform:uppercase; color:#5C8DA3; margin:0 0 0.7rem; }
.mega-items{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0.1rem; }
.mega-items li{ opacity:0; transform:translateY(-8px); transition:opacity .3s ease, transform .3s ease; transition-delay:0s; }
.has-megamenu:hover .mega-items li, .has-megamenu:focus-within .mega-items li{ opacity:1; transform:translateY(0); transition-delay:calc(var(--i) * 0.05s); }
.mega-items a{ display:flex; align-items:flex-start; gap:0.65rem; padding:0.5rem 0.5rem; border-radius:var(--radius-s); text-decoration:none; }
.mega-items a:hover{ background:rgba(255,255,255,0.07); }
.mi-icon{ flex:0 0 auto; width:30px; height:30px; border-radius:8px; background:rgba(106,198,183,0.12); border:1px solid rgba(106,198,183,0.28); display:flex; align-items:center; justify-content:center; color:#6AC6B7; }
.mi-icon svg{ width:16px; height:16px; }
.mi-text{ display:flex; flex-direction:column; gap:0.18rem; min-width:0; }
.mi-text b{ font-size:0.85rem; color:#fff; font-weight:600; }
.mi-sum{ overflow-wrap:anywhere; font-size:0.72rem; color:#8FB2BF; line-height:1.35; }
.mi-badges{ display:flex; flex-wrap:wrap; gap:0.3rem; margin-top:0.2rem; }
.mi-badges .mb{ font-family:var(--font-mono); font-size:0.6rem; letter-spacing:0.01em; color:#B9CEDA; border:1px solid rgba(255,255,255,0.14); border-radius:99px; padding:0.14rem 0.45rem; white-space:nowrap; }
.mega-cta{ background:linear-gradient(160deg, rgba(31,157,217,0.18), rgba(106,198,183,0.08)); border:1px solid rgba(31,157,217,0.35); border-radius:var(--radius-m); padding:1.1rem 1.15rem; display:flex; flex-direction:column; justify-content:space-between; opacity:0; transform:translateY(-8px); transition:opacity .3s ease, transform .3s ease; transition-delay:0.24s; }
.has-megamenu:hover .mega-cta, .has-megamenu:focus-within .mega-cta{ opacity:1; transform:translateY(0); }
.mega-cta-icon{ width:34px; height:34px; border-radius:9px; background:rgba(31,157,217,0.18); border:1px solid rgba(31,157,217,0.4); display:flex; align-items:center; justify-content:center; color:#7FC9E8; margin-bottom:0.7rem; }
.mega-cta-icon svg{ width:18px; height:18px; }
.mega-cta .eb{ font-family:var(--font-mono); font-size:0.6rem; letter-spacing:0.08em; text-transform:uppercase; color:#7FC9E8; }
.mega-cta h4{ color:#fff; font-family:var(--font-body); font-weight:600; font-size:0.96rem; margin:0.4rem 0 0.4rem; line-height:1.2; }
.mega-cta p{ color:#AFC7D3; font-size:0.75rem; line-height:1.5; margin-bottom:0; }
.mega-cta-go{ white-space:normal; margin-top:0.9rem; font-family:var(--font-mono); font-size:0.76rem; color:#fff; text-decoration:none; display:inline-flex; align-items:center; gap:0.4rem; }
@media (max-width:1180px){
  .has-megamenu .mega-menu{ grid-template-columns:1fr 1fr; width:min(740px,94vw); }
  .mega-cta{ grid-column:1 / -1; }
}
@media (max-width:1200px){
  .has-megamenu .mega-menu{ position:static; opacity:1; visibility:visible; pointer-events:auto; transform:none; box-shadow:none; border:none; background:transparent; padding:0.2rem 0 0.2rem 1.1rem; margin-top:0.3rem; width:auto; display:flex; flex-direction:column; gap:1.1rem; }
  .mega-items li{ opacity:1; transform:none; }
  .mega-cta{ opacity:1; transform:none; margin-top:0.2rem; }
  .megamenu-single .mi-sum, .megamenu-single .mi-badges{ display:none; }
  .megamenu-single .mega-items a{ padding:0.45rem 0.5rem; align-items:center; }
  .megamenu-single .mi-text{ gap:0; }
}
.nav-burger{ display:none; background:none; border:1px solid rgba(255,255,255,0.3); color:#fff; border-radius:var(--radius-s); padding:0.5rem 0.6rem; }
@media (max-width:1200px){
  .nav-links{ display:none; }
  .nav-burger{ display:inline-flex; }
}
@media (max-width:640px){
  .nav-apps{ gap:0.5rem; }
  .nav-apps a span{ display:none; }
  .nav-apps a{ flex-direction:column; gap:0.15rem; width:40px; height:40px; justify-content:center; border:1px solid rgba(255,255,255,0.32); border-radius:10px; background:rgba(255,255,255,0.07); color:#EAF3F8; }
  .nav-apps a:hover, .nav-apps a:active{ background:rgba(255,255,255,0.16); border-color:rgba(255,255,255,0.5); color:#fff; }
  .nav-apps a svg{ width:15px; height:15px; }
  .nav-apps-tag{ display:block; font-style:normal; font-family:var(--font-mono); font-size:0.42rem; letter-spacing:0.02em; line-height:1; }
  .nav-apps-div{ display:none; }
}

/* Dar telefonlar: ust menu (logo + LoRa/MBus + dil + menu dugmesi) tek satira sigsin */
@media (max-width:420px){
  .nav .wrap{ gap:0.6rem; }
  .nav-cta{ gap:0.5rem; }
  .brand{ gap:0.45rem; }
  .brand .mk{ height:40px; }
  .nav.scrolled .brand .mk{ height:36px; }
  .brand .wd{ font-size:1.35rem; }
  .nav-apps{ gap:0.35rem; }
  .nav-apps a{ width:36px; height:36px; }
  .lang-switch{ margin-left:0; gap:0.2rem; }
  .lang-switch a{ padding:0.25rem 0.4rem; }
  .nav-burger{ padding:0.45rem 0.5rem; }
}
@media (max-width:340px){
  .brand .wd{ display:none; }
}

/* ============================= HERO ============================= */
.hero{ position:relative; background-color:var(--deep); background-image:radial-gradient(ellipse 900px 700px at 88% -10%, rgba(31,157,217,0.22), transparent 60%), radial-gradient(ellipse 640px 640px at -6% 106%, rgba(106,198,183,0.14), transparent 60%); color:#EAF3F8; padding:clamp(7.5rem,14vw,10rem) 0 clamp(4rem,8vw,6rem); overflow:hidden; }
.hero::before{
  content:""; position:absolute; inset:0; z-index:0;
  background-image:
    linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
  background-size:40px 40px, 40px 40px;
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.hero::after{ content:""; position:absolute; right:0; top:0; bottom:0; width:2px; z-index:0; background:linear-gradient(rgba(255,255,255,0), var(--accent), rgba(255,255,255,0)); opacity:0.55; }
.hero .wrap{ position:relative; z-index:1; display:grid; grid-template-columns:1.05fr 0.95fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
@media (max-width:960px){ .hero .wrap{ grid-template-columns:1fr; } }

.hero-copy h1{ color:#fff; font-family:var(--font-hero); font-weight:700; font-size:clamp(2.6rem,5.4vw,4.4rem); line-height:0.98; letter-spacing:0.002em; margin-top:0.9rem; }
.hero-copy .sub{ color:#B7D1DF; font-size:1.1rem; line-height:1.6; max-width:52ch; margin-top:1.3rem; }
.hero-copy .btn-row{ margin-top:2rem; }
.trust-strip{ display:flex; gap:clamp(1.2rem,3vw,2.2rem); flex-wrap:wrap; margin-top:3rem; padding-top:1.8rem; border-top:1px solid rgba(255,255,255,0.12); }
.trust-strip div{ }
.trust-strip .v{ font-family:var(--font-mono); font-weight:600; font-size:1.15rem; color:#fff; text-shadow:0 0 14px rgba(31,157,217,0.35); }
.trust-strip .l{ font-size:0.76rem; color:#8FAFC0; margin-top:0.15rem; }

/* hero visual: real-photo carousel + signal path */
.hero-visual{ position:relative; display:flex; justify-content:center; align-items:center; }
.hero-photo-wrap{ position:relative; width:min(100%, 420px); }
@media (min-width:1360px){
  .hero-photo-wrap{ width:min(100%, 525px); transform:translate(2cm, -2cm); }
}
.hero-carousel{ position:relative; aspect-ratio:4/3.1; }
.hero-carousel .hc-slide{ position:absolute; inset:0; opacity:0; transition:opacity .6s ease; display:flex; align-items:center; justify-content:center; }
.hero-carousel .hc-slide.active{ opacity:1; }
.hero-carousel img{ max-width:90%; max-height:90%; width:auto; height:auto; object-fit:contain; display:block; margin:auto; filter:drop-shadow(0 0 26px rgba(31,157,217,0.35)) drop-shadow(0 20px 28px rgba(0,0,0,0.45)); }
.hero-caption{ position:absolute; left:1rem; bottom:1rem; background:rgba(1,56,73,0.82); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,0.14); border-radius:var(--radius-s); padding:0.5rem 0.8rem; font-family:var(--font-mono); font-size:0.72rem; color:#EAF3F8; max-width:calc(100% - 2rem); }
.hero-caption b{ color:#fff; }
.hero-photo{ position:relative; border-radius:var(--radius-l); overflow:hidden; line-height:0; }
.hero-photo img{ display:block; width:100%; height:auto; aspect-ratio:5/2; object-fit:cover; object-position:center; }
@media (max-width:900px){ .hero-photo img{ aspect-ratio:16/9; } }
@media (max-width:560px){ .hero-photo img{ aspect-ratio:4/3; } }
.hero-photo .hero-caption{ line-height:1.4; }
.hc-arrow{ position:absolute; top:50%; transform:translateY(-50%); z-index:2; width:32px; height:32px; border-radius:50%; background:rgba(1,56,73,0.55); border:1px solid rgba(255,255,255,0.3); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:background .15s ease; }
.hc-arrow:hover{ background:rgba(1,56,73,0.85); }
.hc-arrow.prev{ left:0.7rem; } .hc-arrow.next{ right:0.7rem; }
.hc-dots{ position:absolute; right:0.9rem; bottom:1rem; display:flex; gap:0.4rem; z-index:2; }
.hc-dots button{ width:7px; height:7px; padding:0; border-radius:50%; border:1px solid rgba(255,255,255,0.6); background:rgba(255,255,255,0.25); cursor:pointer; }
.hc-dots button.active{ background:#fff; }
.pulse-ring{ position:absolute; border-radius:50%; border:1px solid var(--blue-bright); opacity:0; left:50%; top:38%; transform:translate(-50%,-50%); pointer-events:none; }
.pulse-ring{ animation: pulseOut 3.6s cubic-bezier(.2,.6,.3,1) infinite; }
.pulse-ring.r2{ animation-delay:1.6s; }
@keyframes pulseOut{
  0%{ width:32px; height:32px; opacity:0.35; }
  100%{ width:clamp(140px,42vw,260px); height:clamp(140px,42vw,260px); opacity:0; }
}

/* signal-path: horizontal telemetry readout beneath the carousel, same width as the photo */
.signal-path{ list-style:none; margin:1.4rem 0 0; padding:0; display:flex; gap:0.4rem; width:100%; }
.signal-path li{ position:relative; flex:1 1 0; min-width:0; padding:0.55rem 0.4rem; font-family:var(--font-mono); font-size:0.64rem; line-height:1.3; color:#8FAFC0; border:1px solid rgba(255,255,255,0.13); border-radius:var(--radius-s); background:rgba(255,255,255,0.03); text-align:center; }
.signal-path li b{ display:block; color:#EAF3F8; font-weight:600; font-size:0.74rem; margin-bottom:0.1rem; }
.signal-path li::after{ content:""; position:absolute; right:-0.42rem; top:50%; width:5px; height:5px; transform:translateY(-50%) rotate(45deg); border-top:1px solid rgba(255,255,255,0.22); border-right:1px solid rgba(255,255,255,0.22); }
.signal-path li:last-child::after{ content:none; }
.signal-path li.active{ border-color:rgba(63,217,190,0.45); background:var(--signal-soft); }
.signal-path li.active b{ color:var(--signal); }

/* ============================= PILLARS (Section 2) ============================= */
.pillar-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius-m); overflow:hidden; margin-top:2.6rem; }
@media (max-width:820px){ .pillar-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .pillar-grid{ grid-template-columns:1fr; } }
.pillar{ background:var(--surface); padding:1.6rem 1.5rem; }
.pillar svg{ color:var(--blue-strong); }
.pillar h3{ font-size:1.05rem; margin:0.9rem 0 0.4rem; }
.pillar p{ font-size:0.87rem; color:var(--muted); line-height:1.5; }

.proof-row{ margin-top:3rem; display:grid; grid-template-columns:1fr 1.1fr; gap:2.5rem; align-items:center; background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-l); padding:1.6rem; }
@media (max-width:760px){ .proof-row{ grid-template-columns:1fr; } }
.proof-row img{ border-radius:var(--radius-m); }
.proof-row .txt .eyebrow{ margin-bottom:0.7rem; }
.proof-row .txt p{ color:var(--ink-soft); margin-top:0.8rem; font-size:0.98rem; line-height:1.65; }

/* ============================= PRODUCT ECOSYSTEM ============================= */
.product-intro{ max-width:760px; color:#AFC7D3; font-size:1.02rem; line-height:1.7; margin-top:1rem; }
.product-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; margin-top:2.8rem; }
@media (max-width:900px){ .product-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .product-grid{ grid-template-columns:1fr; } }
.pcard{ background:var(--deep-3); border:1px solid rgba(255,255,255,0.08); border-radius:var(--radius-l); overflow:hidden; display:flex; flex-direction:column; position:relative; transition:border-color .2s ease, transform .2s ease; }
.pcard:hover{ border-color:rgba(124,192,234,0.4); transform:translateY(-1px); }
.pcard .pimg{ background:#0E1F2C; display:flex; align-items:center; justify-content:center; padding:1.3rem; position:relative; overflow:hidden; min-height:200px; }
.pcard .pimg img{ max-height:190px; width:auto; margin:0 auto; filter:drop-shadow(0 12px 20px rgba(0,0,0,0.4)); }
.pcard .ptag{ position:absolute; top:0.8rem; left:0.8rem; font-family:var(--font-mono); font-size:0.62rem; letter-spacing:0.08em; text-transform:uppercase; padding:0.28rem 0.55rem; border-radius:var(--radius-s); background:rgba(0,0,0,0.4); border:1px solid rgba(255,255,255,0.18); color:#CFE4EE; }
.pcard .ptag.action{ background:rgba(63,217,190,0.16); border-color:rgba(63,217,190,0.4); color:#8FF0DC; }
.pcard .pbody{ padding:1.4rem 1.5rem; display:flex; flex-direction:column; flex:1; }
.pcard .pcode{ font-family:var(--font-mono); font-size:0.78rem; color:var(--blue-bright); letter-spacing:0.04em; }
.pcard h3{ color:#fff; font-size:1.2rem; margin:0.35rem 0 0.5rem; }
.pcard .pdesc{ color:#9FBACB; font-size:0.85rem; line-height:1.55; margin-bottom:1rem; }
.pcard .pchips{ display:flex; flex-wrap:wrap; gap:0.4rem; margin-top:auto; }
.pchip{ font-family:var(--font-mono); font-size:0.68rem; padding:0.24rem 0.55rem; border-radius:var(--radius-s); border:1px solid rgba(255,255,255,0.16); color:#B9CEDA; }

/* featured card — I-METS 80 is the only module that also acts (vana kontrolü); it earns a distinct, wider treatment instead of matching the read-only modules 1-for-1 */
.pcard.featured{ grid-column:1 / -1; display:grid; grid-template-columns:0.85fr 1.15fr; border-color:rgba(63,217,190,0.3); background:linear-gradient(135deg, var(--deep-3), #0E2A28); }
@media (max-width:760px){ .pcard.featured{ grid-template-columns:1fr; } }
.pcard.featured .pimg{ min-height:260px; padding:1.8rem; }
.pcard.featured .pimg img{ max-height:230px; }
.pcard.featured .pbody{ padding:2rem 2.2rem; justify-content:center; }
.pcard.featured h3{ font-size:1.6rem; }
.pcard.featured .pdesc{ font-size:0.95rem; max-width:44ch; }

/* ============================= NEDEN OSOS / DIFFERENTIATORS (section 3B) ============================= */
.diff-grid{ list-style:none; margin:2.6rem 0 0; padding:0; display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius-m); overflow:hidden; counter-reset:diff; }
@media (max-width:980px){ .diff-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .diff-grid{ grid-template-columns:1fr; } }
.diff-grid li{ background:var(--surface); padding:1.6rem 1.4rem; }
.diff-grid .dnum{ font-family:var(--font-mono); font-size:0.85rem; font-weight:600; color:var(--copper); }
.diff-grid h4{ font-size:1rem; margin:0.7rem 0 0.4rem; }
.diff-grid p{ font-size:0.85rem; color:var(--muted); line-height:1.5; }

/* ============================= ARCHITECTURE FLOW (section 4 — compact recap strip) ============================= */
.arch-strip{ padding-top:clamp(2.4rem,5vw,3.4rem); padding-bottom:clamp(1.4rem,3vw,2rem); }
.arch-strip .section-head{ margin-bottom:1.8rem; }
.arch-flow{ display:flex; align-items:stretch; gap:0; margin-top:2.6rem; }
@media (max-width:900px){ .arch-flow{ flex-direction:column; } }
.arch-node{ flex:1 1 0; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-m); padding:1.3rem 1.1rem; text-align:center; opacity:0.4; transform:translateY(10px); transition:opacity .5s ease, transform .5s ease, border-color .3s ease, box-shadow .3s ease; }
.arch-node.lit{ opacity:1; transform:translateY(0); border-color:var(--blue-strong); box-shadow:0 8px 24px -14px rgba(28,111,174,0.4); }
.arch-node .idx{ font-family:var(--font-mono); font-size:0.68rem; color:var(--blue-strong); }
.arch-node h4{ font-size:0.98rem; margin:0.5rem 0 0.3rem; }
.arch-node p{ font-size:0.78rem; color:var(--muted); line-height:1.4; }
.arch-arrow{ flex:0 0 30px; display:flex; align-items:center; justify-content:center; color:var(--border-strong); }
@media (max-width:900px){ .arch-arrow{ height:24px; transform:rotate(90deg); } }
.arch-node.lit ~ .arch-arrow, .arch-arrow.lit{ color:var(--blue-strong); }

/* ============================= LORAWAN SECTION ============================= */
.lorawan-diagram{ margin-top:3rem; background:var(--deep-3); border:1px solid rgba(255,255,255,0.08); border-radius:var(--radius-l); padding:clamp(1.4rem,3vw,2.6rem); }
.lorawan-diagram svg{ width:100%; height:auto; display:block; }
.lorawan-diagram figcaption{ margin-top:1.2rem; font-size:0.85rem; color:#93B2C3; font-family:var(--font-mono); }
.class-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; margin-top:2.2rem; }
@media (max-width:700px){ .class-grid{ grid-template-columns:1fr; } }
.class-card{ background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.09); border-radius:var(--radius-m); padding:1.3rem 1.4rem; }
.class-card .tag{ font-family:var(--font-mono); font-size:0.7rem; color:var(--signal); text-transform:uppercase; letter-spacing:0.06em; }
.class-card h4{ color:#fff; font-size:1.05rem; margin:0.5rem 0 0.5rem; }
.class-card p{ color:#9FBACB; font-size:0.86rem; line-height:1.55; }
.security-strip{ display:flex; flex-wrap:wrap; gap:0.6rem; margin-top:1.8rem; }
.security-strip .pchip{ color:#CFE4EE; }

/* ============================= INDUSTRY SOLUTIONS ============================= */
.industry-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius-m); overflow:hidden; margin-top:2.6rem; }
@media (max-width:980px){ .industry-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .industry-grid{ grid-template-columns:1fr; } }
.industry-card{ background:var(--surface); padding:1.4rem 1.2rem; min-height:190px; display:flex; flex-direction:column; }
.industry-card .tag{ font-family:var(--font-mono); font-size:0.66rem; color:var(--blue-strong); text-transform:uppercase; letter-spacing:0.05em; }
.industry-card h4{ font-size:1rem; margin:0.6rem 0 0.5rem; }
.industry-card p{ font-size:0.82rem; color:var(--muted); line-height:1.5; margin-bottom:0.8rem; }
.industry-card .rel{ margin-top:auto; font-family:var(--font-mono); font-size:0.68rem; color:var(--copper); }

/* ============================= PLATFORM + AI ============================= */
.shot-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.4rem; margin-top:2.8rem; }
@media (max-width:820px){ .shot-grid{ grid-template-columns:1fr; } }
.shot-card{ background:var(--deep-3); border:1px solid rgba(255,255,255,0.08); border-radius:var(--radius-l); overflow:hidden; }
.shot-chrome{ display:flex; gap:0.4rem; align-items:center; padding:0.7rem 0.9rem; border-bottom:1px solid rgba(255,255,255,0.08); }
.shot-chrome i{ width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,0.2); display:block; }
.shot-chrome span{ margin-left:0.5rem; font-family:var(--font-mono); font-size:0.68rem; color:#8FAFC0; }
.shot-card{ position:relative; }
.shot-card img{ display:block; width:100%; }
.shot-img{ cursor:zoom-in; }
.shot-zoom-badge{ position:absolute; top:3.6rem; right:0.9rem; width:34px; height:34px; border-radius:50%; background:rgba(5,9,11,0.72); border:1px solid rgba(255,255,255,0.16); display:flex; align-items:center; justify-content:center; opacity:0; transform:translateY(-4px); transition:opacity .2s ease, transform .2s ease; pointer-events:none; }
.shot-zoom-badge svg{ width:16px; height:16px; stroke:#EAF3F7; }
.shot-card:hover .shot-zoom-badge, .shot-img:focus-visible ~ .shot-zoom-badge{ opacity:1; transform:translateY(0); }
.shot-caption{ padding:1rem 1.2rem 1.3rem; }
.shot-caption h4{ color:#fff; font-size:0.98rem; margin-bottom:0.35rem; }
.shot-caption p{ color:#9FBACB; font-size:0.82rem; line-height:1.5; }
.shot-lightbox{ position:fixed; inset:0; z-index:999; display:flex; align-items:center; justify-content:center; padding:4vh 4vw; background:rgba(3,6,8,0.86); backdrop-filter:blur(6px); opacity:0; visibility:hidden; transition:opacity .25s ease; }
.shot-lightbox.is-open{ opacity:1; visibility:visible; }
.shot-lightbox-inner{ position:relative; max-width:min(1400px,92vw); max-height:92vh; display:flex; flex-direction:column; transform:scale(.96); transition:transform .25s ease; }
.shot-lightbox.is-open .shot-lightbox-inner{ transform:scale(1); }
.shot-lightbox-inner img{ display:block; width:100%; max-height:76vh; object-fit:contain; border-radius:var(--radius-m); border:1px solid rgba(255,255,255,0.14); background:var(--deep-3); }
.shot-lightbox-cap{ margin-top:1rem; text-align:center; }
.shot-lightbox-cap h4{ color:#fff; font-size:1.05rem; margin-bottom:0.3rem; }
.shot-lightbox-cap p{ color:#9FBACB; font-size:0.88rem; }
.shot-lightbox-close{ position:absolute; top:-48px; right:0; width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.2); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.shot-lightbox-close:hover{ background:rgba(255,255,255,0.18); }
.shot-lightbox-close svg{ width:18px; height:18px; }
@media (prefers-reduced-motion: reduce){ .shot-lightbox, .shot-lightbox-inner{ transition:none; } }
.ai-table{ margin-top:2rem; border:1px solid rgba(255,255,255,0.1); border-radius:var(--radius-m); overflow:hidden; }
.ai-table table{ width:100%; border-collapse:collapse; font-size:0.86rem; }
.ai-table th{ text-align:left; font-family:var(--font-mono); font-size:0.66rem; text-transform:uppercase; letter-spacing:0.06em; color:#8FAFC0; padding:0.7rem 1rem; background:rgba(255,255,255,0.03); border-bottom:1px solid rgba(255,255,255,0.1); }
.ai-table td{ padding:0.7rem 1rem; color:#D3E4EC; border-bottom:1px solid rgba(255,255,255,0.06); }
.ai-table tr:last-child td{ border-bottom:none; }

/* ============================= REFERENCES ============================= */
.ref-layout{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:2.6rem; margin-top:2.8rem; align-items:start; }
@media (max-width:860px){ .ref-layout{ grid-template-columns:1fr; } }
.ref-layout img{ border-radius:var(--radius-l); box-shadow:var(--shadow-1); }
.ref-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.ref-list li{ padding:1.05rem 0; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; gap:1rem; align-items:baseline; }
.ref-list li:first-child{ padding-top:0; }
.ref-list b{ font-size:1rem; }
.ref-list span{ color:var(--muted); font-size:0.88rem; text-align:right; }

/* ============================= RND / TRUST ============================= */
.certs-frame{ margin-top:2.6rem; border:1px solid var(--border); border-radius:var(--radius-l); overflow:hidden; background:var(--surface); box-shadow:var(--shadow-1); }
.certs-frame img{ width:100%; display:block; }
.cert-pill-row{ display:flex; flex-wrap:wrap; gap:0.55rem; margin-top:1.8rem; }
.cert-pill{ font-family:var(--font-mono); font-size:0.74rem; padding:0.35rem 0.75rem; border-radius:var(--radius-s); border:1px solid var(--border-strong); color:var(--ink-soft); background:var(--surface); }

/* ============================= FINAL CTA ============================= */
.final-cta{ text-align:center; padding:clamp(5rem,10vw,7.5rem) 0; }
.final-cta .eyebrow{ justify-content:center; }
.final-cta h2{ font-size:clamp(2.1rem,5vw,3.4rem); margin:0.9rem auto 1.2rem; max-width:18ch; }
.final-cta p{ color:#AFC7D3; max-width:52ch; margin:0 auto 2.2rem; font-size:1.05rem; }
.final-cta .btn-row{ justify-content:center; }

/* ============================= FOOTER ============================= */
footer.site{ background:var(--deep); color:#9FBACB; padding:3.4rem 0 2rem; }
.foot-grid{ display:grid; grid-template-columns:1.4fr repeat(4,1fr); gap:2rem; }
@media (max-width:860px){ .foot-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .foot-grid{ grid-template-columns:1fr; } }
.foot-grid h5{ font-family:var(--font-mono); font-size:0.7rem; text-transform:uppercase; letter-spacing:0.08em; color:#6E8B9C; margin-bottom:0.9rem; }
.foot-grid ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0.55rem; }
.foot-grid a{ text-decoration:none; color:#B9CEDA; font-size:0.86rem; }
.foot-grid a:hover{ color:#fff; }
.foot-bottom{ margin-top:2.6rem; padding-top:1.6rem; border-top:1px solid rgba(255,255,255,0.1); display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; font-size:0.78rem; color:#6E8B9C; font-family:var(--font-mono); }

/* ============================= REVEAL ============================= */
.reveal{ opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:none; }

/* ============================= HERO GLOW — enerjik ağ/sinyal dekorasyonu ============================= */
.hero-glow{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.hero-glow svg{ width:100%; height:100%; display:block; }
.hg-nodes circle{ transform-box:fill-box; transform-origin:center; filter:drop-shadow(0 0 4px currentColor) drop-shadow(0 0 11px currentColor); animation:hgNodePulse 2.2s ease-in-out infinite; }
@keyframes hgPulse{ 0%,100%{ opacity:.4; } 50%{ opacity:1; } }
@keyframes hgNodePulse{ 0%,100%{ opacity:.5; transform:scale(1); } 50%{ opacity:1; transform:scale(1.55); } }
.hg-lines path{ stroke-dasharray:10 6; stroke-linecap:round; animation:hgFlow 6.5s linear infinite; }
@keyframes hgFlow{ to{ stroke-dashoffset:-560; } }
.hg-lines[stroke="#1F9DD9"]{ color:#1F9DD9; }
.hg-lines[stroke="#6AC6B7"]{ color:#6AC6B7; }
.hg-lines[stroke-opacity="0.16"]{ stroke-opacity:0.24; }
.hg-lines[stroke-opacity="0.35"]{ stroke-opacity:0.42; }
.hg-lines path{ stroke-width:1.5px; filter:drop-shadow(0 0 1.2px currentColor); }
.hg-photons circle{ filter:drop-shadow(0 0 1.6px currentColor) drop-shadow(0 0 5px currentColor); animation-name:hgPhotonFade; animation-timing-function:linear; animation-iteration-count:infinite; }
@keyframes hgPhotonFade{ 0%,100%{ opacity:0; } 12%,55%{ opacity:1; } 90%{ opacity:0; } }

/* diyagram düğümlerine / sinyal halkalarına ince neon parıltısı */
.big-diagram svg circle[fill="none"], .lorawan-diagram svg circle[fill="none"]{ animation:hgPulse 2.8s ease-in-out infinite; }
.big-diagram svg rect[fill="none"], .lorawan-diagram svg rect[fill="none"]{ filter:drop-shadow(0 0 5px rgba(106,198,183,0.28)); }

#lorawan{ position:relative; overflow:hidden; }
#lorawan > .wrap{ position:relative; z-index:1; }

#urunler{ position:relative; overflow:hidden; }
#urunler > .wrap{ position:relative; z-index:1; }
#platform{ position:relative; overflow:hidden; }
#platform > .wrap{ position:relative; z-index:1; }
#cta{ position:relative; overflow:hidden; }
#cta > .wrap{ position:relative; z-index:1; }

.hero-glow.light .hg-nodes circle{ filter:none; animation:hgNodePulseLight 2.5s ease-in-out infinite; }
@keyframes hgNodePulseLight{ 0%,100%{ opacity:.42; transform:scale(1); } 50%{ opacity:1; transform:scale(1.45); } }

.section{ overflow:hidden; }
.section > .wrap{ position:relative; z-index:1; }