:root{
  --bg-dark:#0b0c10; --bg-light:#f6f7f9; --text:#0e1217; --brand:#18a4b8; --brand-strong:#0e8797;
  --white:#fff; --grid:26px; --radius:16px; --shadow:0 10px 30px rgba(0,0,0,.08);

  --carousel-height: 64px;
  --carousel-speed: 120s;
}
*{box-sizing:border-box} html,body{margin:0;padding:0}
body{font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:var(--bg-light);line-height:1.6}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-weight:800;margin:0 0 .6rem;line-height:1.15}
h1{font-size:clamp(2rem,5vw,3.2rem)} h2{font-size:clamp(1.6rem,4vw,2.4rem)} h3{font-size:clamp(1.25rem,3vw,1.6rem)}
.display{font-size:clamp(2rem,6vw,3.6rem)} .lead{font-size:clamp(1rem,2.4vw,1.125rem);color:var(--white)}
a{color:var(--brand-strong);text-decoration:none} a:hover{text-decoration:underline}
.placeholder{opacity:.8}

.section{padding:clamp(64px,10vw,120px) 0;position:relative}
.container{width:min(1200px,92%);margin:0 auto}
.center{text-align:center} .white{background:#fff} .dark{background:var(--bg-dark);color:#d7dde3} .light{background:var(--bg-light)}

.blue-grid{
  --blue:#0a6b8a;--blue2:#0f7d9f;
  background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,0)),
             linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px),
             linear-gradient(180deg,rgba(255,255,255,.06) 1px,transparent 1px),
             linear-gradient(180deg,var(--blue),var(--blue2));
  background-size:auto,var(--grid) var(--grid),var(--grid) var(--grid),auto;
  background-attachment:scroll,scroll,scroll,fixed;color:#e9f7fb;
}

.nav{position:sticky;top:0;z-index:50;background:#000;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.nav-inner{width:min(1200px,92%);margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:.6rem 0}
.nav .brand img{height:60px}
.nav .nav-links{display:flex;gap:clamp(16px,4vw,32px);align-items:center}
.nav .nav-links a{color:#fff;font-weight:700;letter-spacing:.2px}
.nav .lang-switch{padding:.35rem .6rem;border:1px solid #333;border-radius:999px}
.nav-toggle{display:none}.hamburger{display:none;cursor:pointer}.hamburger span{display:block;width:24px;height:2px;background:#fff;margin:5px 0}
@media (max-width:860px){
  .hamburger{display:block}
  .nav .nav-links{position:fixed;inset:56px 0 auto 0;background:#000;display:grid;gap:16px;padding:20px;border-top:1px solid #111;transform:translateY(-120%);transition:transform .25s ease}
  .nav-toggle:checked ~ .nav-links{transform:translateY(0)}
}

.grid{display:grid;gap:clamp(20px,4vw,40px)}
.grid.two{grid-template-columns:1fr}.grid.three{grid-template-columns:1fr}.grid.four{grid-template-columns:1fr 1fr}
@media (min-width:860px){.grid.two{grid-template-columns:1fr 1fr;align-items:center}.grid.three{grid-template-columns:repeat(3,1fr)}.grid.four{grid-template-columns:repeat(4,1fr)}}

.hero{min-height:68vh;display:flex;align-items:center}.hero-inner{padding-top:6vh}
.hero-logo{width:min(260px,60%);margin:0 auto 18px;filter:drop-shadow(0 10px 24px rgba(0,0,0,.2))}
.hero-logo.small{width:140px}.kicker{font-size:clamp(1rem,2.8vw,1.25rem);opacity:.95}

.hero.dark { background: var(--bg-dark); color:#d7dde3; }
.hero-split{ align-items:center; }
.hero-left{ text-align:left; }
.hero-left .hero-logo{
  width:min(240px, 40%);
  margin:0 0 12px 0;
  filter:drop-shadow(0 10px 24px rgba(0,0,0,.25));
}
.hero-product{
  display:flex; align-items:center; justify-content:flex-end;
}
.hero-product img{
  width:min(760px,100%); height:auto;
  filter:drop-shadow(0 30px 60px rgba(0,0,0,.45));
}

@media (max-width:860px){
  .hero-left .hero-logo{ width:160px; }
  .hero-product{ justify-content:center; margin-top:12px; }
}

.hero-panorama{
  position:relative;
  background:var(--bg-dark);
  color:#e6edf3;
  overflow:hidden;
  padding: clamp(80px, 12vw, 140px) 0;
}
.hero-panorama .logo-claim{
  position:relative; z-index:2; text-align:left;
  max-width: 720px;
}
.hero-logo.xl{
  width:min(360px, 55%);
  margin:0 0 10px 0;
  filter: drop-shadow(0 12px 30px rgba(0,0,0,.28));
}
.hero-claim{
  margin:.25rem 0 .6rem;
  font-size: clamp(2.2rem, 6.8vw, 4.2rem);
}
.kicker{ color:#cfe7ee; }

.product-panorama{
  position:absolute;
  right:-12vw; bottom:-6vh;
  width:120vw; max-width:none;
  z-index:0; pointer-events:none;
}
.product-panorama img{
  width:100%; height:auto;
  transform: rotate(-2deg);
  filter: drop-shadow(0 40px 80px rgba(0,0,0,.5));
}

.hero-panorama::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(11,12,16,.92) 0%,
                                      rgba(11,12,16,.55) 40%,
                                      rgba(11,12,16,0) 70%);
  z-index:1;
}

@media (max-width: 860px){
  .hero-logo.xl{ width:200px; }
  .hero-claim{ font-size: clamp(1.8rem, 8vw, 3rem); }
  .product-panorama{ right:-30vw; bottom:-8vh; width:160vw; }
}

.video-bleed{ padding: clamp(40px, 8vw, 80px) 0; }
.video-outer{
  width:100vw;
  margin-left: calc(50% - 50vw);
}
.video-full{
  border-radius: 0;
  box-shadow: none;
}
.video-full img{ width:100%; height:auto; display:block; }

.product-panorama{
  position:absolute;
  right:-6vw;
  bottom:-3vh;
  width:min(70vw, 1100px);
  max-width:1100px;
  z-index:0; pointer-events:none;
}
.product-panorama img{
  width:100%; height:auto;
  transform: rotate(-1deg);
  filter: drop-shadow(0 36px 72px rgba(0,0,0,.5));
}

.hero-panorama::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(90deg,
      rgba(11,12,16,1) 0%,
      rgba(11,12,16,.92) 28%,
      rgba(11,12,16,.55) 48%,
      rgba(11,12,16,0) 70%);
  z-index:1;
}

@media (max-width: 860px){
  .product-panorama{
    right:-18vw; bottom:-6vh;
    width:120vw;
  }
}

.team-hero-frame{ position:relative; }

.video-section .team-hero-frame{
  border:1px solid rgba(255,255,255,.18);
  border-radius:16px;
  overflow:hidden;
  box-shadow: 0 20px 50px rgba(0,0,0,.25);
}



.video-bleed { padding: 0; }
.video-outer { width: auto; margin-left: 0; }
.video-full  { border-radius: 0; box-shadow: none; }

.video-placeholder{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.video-placeholder img{width:100%}.video-label{position:absolute;inset:auto 12px 12px auto;background:rgba(0,0,0,.7);color:#fff;padding:8px 10px;border-radius:10px;font-size:.8rem;text-align:right}

.btn{display:inline-flex;align-items:center;justify-content:center;padding:.85rem 1.1rem;border-radius:12px;font-weight:800;background:#0f1720;color:#fff;border:1px solid transparent;transition:transform .06s ease,background .2s ease}
.btn:hover{transform:translateY(-1px)}.btn.primary{background:var(--brand)}.btn.primary:hover{background:var(--brand-strong)}

.module-stage{min-height:60vh}
.module-wrap{position:sticky;top:10vh;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 20px 40px rgba(0,0,0,.35))}
.module{width:min(800px,90%);border-radius:10px;opacity:0;transform:translateX(60px);transition:opacity .6s ease, transform .6s ease}
.module.is-visible{opacity:1;transform:translateX(0)}
.product-highlight.js-parallax .module-wrap{transform:translateY(calc(-10vh * var(--p,0)))}
.product-highlight.js-parallax .module{opacity:calc(1 - var(--p,0))}

@supports (animation-timeline: --module){
  .module{opacity:1;transform:none;transition:none}
  .module-wrap{view-timeline-name:--module;view-timeline-axis:block;animation:parallax linear both;animation-timeline:--module;animation-range:cover 0% 100%}
  .module{animation:module-enter .9s ease-out both, module-fade-in linear both, module-fade-out linear both;animation-timeline:auto, --module, --module;animation-range:normal, entry 0% 25%, exit 0% 40%}
  @keyframes parallax{from{transform:translateY(0)}to{transform:translateY(-10vh)}}
  @keyframes module-enter{from{opacity:0;transform:translateX(60px)}to{opacity:1;transform:translateX(0)}}
  @keyframes module-fade-in{from{opacity:0}to{opacity:1}}
  @keyframes module-fade-out{from{opacity:1}to{opacity:0}}
}

.logo-track{overflow:hidden;mask-image:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent)}
.logos{display:flex;align-items:center;gap:48px;animation:slide-logos 22s linear infinite;padding:10px 8px}
.logos img{height:48px;width:auto;opacity:.9}
@keyframes slide-logos{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.carousel {
  width: 100%;
  height: var(--carousel-height);
  overflow: hidden;
  position: relative;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.carousel-inner {
  position: relative;
  width: 100%;
  height: 100%;
}

.carousel-track {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  height: 100%;
  will-change: transform;
}

.carousel-track img {
  height: 100%;
  width: auto;
  flex: 0 0 auto;
  object-fit: contain;
}

.carousel-track--first {
  animation: scroll-left var(--carousel-speed) linear infinite;
}

.carousel-track--second {
  animation: scroll-left-second var(--carousel-speed) linear infinite;
}

@keyframes scroll-left {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}

@keyframes scroll-left-second {
  0%   { transform: translateX(100%); }
  100% { transform: translateX(0); }
}


.benefit{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);padding:20px;border-radius:18px;backdrop-filter:blur(2px)}
.benefit img{width:40px;margin-bottom:8px}.benefit h4{margin:6px 0 8px}

.media.framed{border:1px solid #e5e8ee;border-radius:14px;padding:10px;box-shadow:var(--shadow);background:#fff}
.media img{border-radius:10px}

.footer .col h4{margin-bottom:.6rem}.link-list{list-style:none;margin:0;padding:0;display:grid;gap:.35rem}.link-list a{color:#c9d1d9}.sponsor{height:64px;width:auto}

.blog-hero{border-radius:18px;overflow:hidden;border:1px solid #e5e8ee;box-shadow:var(--shadow);margin-bottom:24px}
.slides{display:flex;width:300%;animation:hero-slide 18s infinite}
.slide{flex:1 0 100%;min-height:180px;display:grid;place-items:center;background:linear-gradient(135deg,#e6f6f9,#f4fafe)}
.slide-text{font-weight:800;font-size:clamp(1rem,2.6vw,1.4rem)}
@keyframes hero-slide{0%,28%{transform:translateX(0)}33%,61%{transform:translateX(-100%)}66%,94%{transform:translateX(-200%)}100%{transform:translateX(-200%)}}

.form{display:grid;gap:14px;background:#fff;border:1px solid #e5e8ee;border-radius:16px;padding:18px;box-shadow:var(--shadow)}
label span{display:block;font-weight:700;margin-bottom:6px;font-size:.95rem}
input[type="text"],input[type="email"],textarea{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #dbe1ea;font:inherit;background:#f9fafb}
.consent{display:flex;align-items:flex-start;gap:10px;font-size:.9rem;color:#333}.consent input{margin-top:.3rem}
.form .btn{width:max-content}

.to-top{position:fixed;right:16px;bottom:16px;background:#000;color:#fff;width:40px;height:40px;display:grid;place-items:center;border-radius:10px;box-shadow:0 10px 24px rgba(0,0,0,.25);opacity:.8}
.to-top:hover{opacity:1;text-decoration:none}

.value-prop .lead{color:#cfe7ee}
.product-highlight .copy h3{margin-top:0}
@media (max-width:860px){.nav .brand img{height:32px}.module-stage{min-height:40vh}.logos img{height:36px}}

.products-list{
  list-style:none; margin:0; padding:0;
  display:grid; gap:clamp(24px,4vw,36px);
}
.product-card{
  display:grid; grid-template-columns:1fr;
  gap:clamp(16px,3vw,32px);
  min-height:33vh; align-items:center;
  background:#fff; border:1px solid #e5e8ee;
  border-radius:18px; padding:clamp(16px,3vw,28px);
  box-shadow:var(--shadow);
  text-decoration:none; color:inherit;
  transition:transform .08s ease, box-shadow .2s ease;
}
.product-card:hover{ transform:translateY(-2px); box-shadow:0 16px 40px rgba(0,0,0,.08); }
.product-card .media img{ border-radius:12px; width:100%; height:auto; object-fit:cover; }

@media (min-width:860px){
  .product-card{ grid-template-columns:1fr 1fr; }
  .products-list li:nth-child(even) .product-card{ direction:rtl; }
  .products-list li:nth-child(even) .product-card > *{ direction:ltr; }
}

.nav .lang-toggle { display: inline; margin-left: clamp(8px, 2vw, 16px); }
.nav .lang-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 9999px;
  border: 1px solid rgba(255,255,255,.25);
  background: transparent;
  color: #fff;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}
.nav .lang-btn:hover { border-color: rgba(255,255,255,.45); background: rgba(255,255,255,.06); }
.nav .lang-btn:focus { outline: 2px solid rgba(255,255,255,.6); outline-offset: 2px; }
@media (max-width: 860px){
  .nav .lang-toggle { margin-left: 12px; }
}

.team-members{
  list-style:none; margin:0; padding:0;
  display:grid; gap:clamp(20px,3.5vw,28px);
}

.team-member{
  display:grid; grid-template-columns:1fr;
  gap:clamp(16px,3vw,28px);
  min-height:33vh;
  align-items:center;
  background:#fff;
  border:1px solid #e5e8ee;
  border-radius:18px;
  padding:clamp(16px,3vw,28px);
  box-shadow:var(--shadow);
}

.team-member .photo{
  align-self:stretch;
}
.team-member .photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:12px;
  min-height:220px;
}

.team-member .copy .name{ margin:0 0 .25rem; }
.team-member .copy .role{ margin:.1rem 0 .6rem; color:#516070; }
.team-member .copy .bio{ margin:0; }

@media (min-width:860px){
  .team-member{ grid-template-columns:1.2fr 1fr; }
  .team-members li:nth-child(even) .team-member{ direction:rtl; }
  .team-members li:nth-child(even) .team-member > *{ direction:ltr; }
}

.team-hero{ padding: clamp(40px, 8vw, 80px) 0; }
.team-hero-frame{
  margin:0;
  border:1px solid rgba(255,255,255,.18);
  border-radius:16px;
  overflow:hidden;
  box-shadow: 0 20px 50px rgba(0,0,0,.25);
  backdrop-filter: blur(1px);
}

.team-hero-frame img{
  display:block; width:100%;
  height:clamp(40vh, 52vw, 68vh);
  object-fit:cover;
}

.team-intro{ margin: 8px 0 0; color:#cfe7ee; text-align: justify; }

.intro-text {
    text-align: justify;
}

.team-row{ padding-block: clamp(36px, 8vw, 64px); }
.team-grid{
  display:grid; gap:clamp(16px, 3vw, 32px);
  grid-template-columns: 1fr;
  align-items:center;
  min-height:33vh;
}

.team-image img{
  width:100%; height:100%; object-fit:cover;
  min-height:28vh;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.08);
}

.team-copy .name{ margin:0 0 .25rem; }
.team-copy .role{ margin:.1rem 0 .6rem; color:#9fb3c3; }
.team-copy .bio{ margin:0; }

@media (min-width: 860px){
  .team-grid{ grid-template-columns: 1.2fr 1fr; }
  .team-grid.row-reverse{ direction: rtl; }
  .team-grid.row-reverse > *{ direction: ltr; }
  .team-image img{ min-height:33vh; }
}

.team-row.dark .role,
.team-row.blue-grid .role { color:#cfe7ee; }
.team-row.dark a,
.team-row.blue-grid a { color:#bfe8f1; }

@supports (animation-timeline: scroll()){
  .team-hero-frame{ animation: team-hero-rise 1s ease-out both; }
  @keyframes team-hero-rise{
    from{ transform: translateY(12px); opacity:.92; }
    to  { transform: translateY(0);    opacity:1;    }
  }
}

.form{ color: var(--text); }
.form label span{ color: var(--text); }
.form small, .form .helptext{ color:#516070; }

.form input::placeholder,
.form textarea::placeholder{ color:#8a94a3; opacity:1; }

.form a{ color: var(--brand-strong); }

.product-highlight .module-stage{
  min-height: auto;
}

.product-highlight .module-wrap{
  position: relative;
  top: 0;
  transform: none;
}

.product-highlight .module{
  max-width: min(640px, 95%);
  opacity: 1;
  transform: none;
}

.hero-panorama .product-panorama{ --p: 0; }
.hero-panorama .product-panorama img{
  transform: translateX(calc(var(--p, 0) * 8vw)) rotate(-1deg);
  opacity: calc(1 - var(--p, 0));
}

@supports (animation-timeline: --x) {
  .hero-panorama{ view-timeline-name: --hero; view-timeline-axis: block; }

  .hero-panorama .product-panorama img{
    animation:
      pan-x   linear both,
      pan-f   linear both;
    animation-timeline: --hero, --hero;
    animation-range:
      entry 0% 10%, exit 0% 45%,
      entry 0% 10%, exit 0% 45%;
  }

  @keyframes pan-x {
    from { transform: translateX(0) rotate(-1deg); }
    to   { transform: translateX(8vw) rotate(-1deg); }
  }
  @keyframes pan-f {
    from { opacity: 1; }
    to   { opacity: 0; }
  }
}

.blue-grid h1,
.blue-grid h2,
.blue-grid h3,
.blue-grid h4,
.blue-grid .display,
.blue-grid p,
.blue-grid li,
.blue-grid a,
.blue-grid .kicker,
.blue-grid .lead {
  text-shadow:
    0 2px 2px rgba(0,0,0,.50),
    0 10px 24px rgba(0,0,0,.38),
    0 0 1px rgba(0,0,0,.35);
}

.blue-grid .display,
.blue-grid h1 {
  text-shadow:
    0 3px 3px rgba(0,0,0,.55),
    0 14px 34px rgba(0,0,0,.42),
    0 0 1.2px rgba(0,0,0,.4);
}

.blue-grid .media img,
.blue-grid .video-placeholder img,
.blue-grid .product-panorama img,
.blue-grid .brand img {
  filter:
    drop-shadow(0 10px 26px rgba(0,0,0,.35))
    drop-shadow(0 26px 60px rgba(0,0,0,.28));
}

.blue-grid .form,
.blue-grid .form * {
  text-shadow: none !important;
  filter: none !important;
}

@media (max-width: 860px){
  .blue-grid h1,
  .blue-grid h2,
  .blue-grid h3,
  .blue-grid h4,
  .blue-grid .display,
  .blue-grid p,
  .blue-grid li,
  .blue-grid a,
  .blue-grid .kicker,
  .blue-grid .lead {
    text-shadow:
      0 1.5px 1.5px rgba(0,0,0,.46),
      0 8px 18px rgba(0,0,0,.3),
      0 0 1px rgba(0,0,0,.3);
  }

  .blue-grid .media img,
  .blue-grid .video-placeholder img,
  .blue-grid .product-panorama img,
  .blue-grid .brand img {
    filter:
      drop-shadow(0 8px 20px rgba(0,0,0,.32))
      drop-shadow(0 20px 44px rgba(0,0,0,.24));
  }
}

.footer {
  padding-top: clamp(8px, 2vw, 20px);
  border-top: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 -20px 40px rgba(0,0,0,.08) inset;
}

.blog .container { display: grid; gap: clamp(20px, 4vw, 32px); }

.blog-cards{
  list-style: none;
  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns: minmax(0, 760px);
  justify-content: center;
  row-gap: clamp(24px, 4vw, 40px);
}

.blog-cards > li{
  list-style: none;
  margin: 0;
  padding: 0;
}
.blog-cards > li::marker { content: none; }

.blog-card img{
  border-radius: 12px;
  width: 100%;
  height: auto;
  object-fit: cover;
}

.blog-card-title{ margin: 10px 0; }
.blog-card-excerpt p{ margin: 0 0 8px; }

.pagination{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  align-items: center;
  margin-top: clamp(12px, 3vw, 20px);
}

.page-link,
.page-ellipsis{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  padding: 8px 12px;
  border: 1px solid #e5e8ee;
  border-radius: 10px;
  background: #fff;
  color: inherit;
  text-decoration: none;
  box-shadow: var(--shadow);
  font-weight: 700;
}

.page-link:hover{ text-decoration: none; transform: translateY(-1px); }
.page-link.current{
  background: var(--brand);
  color: #fff;
  border-color: transparent;
}
.page-link.disabled{
  opacity: .5;
  pointer-events: none;
}
.page-ellipsis{
  border-style: dashed;
  background: #f9fafb;
}

.blog-cards{
  grid-template-columns: minmax(0, clamp(820px, 88vw, 1080px));
  justify-content: center;
}

.blog-cards > li > * { width: 100%; }

.form-alerts{
  list-style:none; margin:0 0 8px; padding:0; display:grid; gap:8px;
}
.alert{
  display:grid; grid-template-columns:auto 1fr; align-items:center;
  gap:10px; padding:10px 12px; border-radius:10px; border:1px solid transparent;
  background:#f6f8fb; color:#0e1217; box-shadow:var(--shadow);
}
.alert::before{
  content:"ℹ"; display:grid; place-items:center; width:24px; height:24px;
  font-weight:800; border-radius:8px; background:#e9eef7;
}
.alert.success{ background:#e9f8ee; border-color:#c5e9d0; }
.alert.success::before{ content:"✓"; background:#d6f1df; }
.alert.error{ background:#fdecec; border-color:#f6c7c7; }
.alert.error::before{ content:"!"; background:#f9d8d8; }
.alert.warning{ background:#fff5e6; border-color:#fde2b8; }
.alert.warning::before{ content:"!"; background:#ffe9c6; }

.is-invalid{ border-color:#e86b6b !important; background:#fff7f7; }
.form small.error{
  display:block; margin-top:6px; color:#b24a4a; font-weight:700;
}

.consent.is-invalid{
  border:1px solid #e86b6b; border-radius:10px; padding:8px;
  background:#fff7f7;
}

@media (max-width: 860px){
  .product-panorama{
    right: -22vw;
    bottom: -14vh;
    width: 135vw;
  }
}

@media (min-width: 1024px) and (max-width: 1399px){
  .hero-panorama .logo-claim{
    margin-left: 0;
    transform: none;
  }
}

@media (min-width: 1024px) and (max-width: 1199px){
  .hero-panorama .logo-claim{ margin-left: 0; transform: none; }
}

@media (min-width: 1200px){
  .hero-panorama .logo-claim{
    margin-left: clamp(-48px, -3.5vw, -96px);
  }
}

@media (min-width: 1600px){
  .hero-panorama .logo-claim{
    margin-left: clamp(-128px, -7vw, -196px);
  }
}

@media (max-width: 860px){
  .hero-panorama{
    padding-bottom: clamp(180px, 28vw, 360px);
  }
  .hero-panorama .product-panorama{
    right: -18vw;
    width: 128vw;
    bottom: -24vw;
  }
}

.video-section .container {
  display: flex;
  justify-content: center;
}

.video-section .video-frame {
  margin: 0;
  width: 100%;
  max-width: 100%;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 50px rgba(0,0,0,.25);
  position: relative;
}

.video-section .video-frame .video-element {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  background: #000;
}

.video-section .video-placeholder {
  width: 100%;
  height: 100%;
}
.video-section .video-placeholder .video-element {
  width: 100%;
  height: auto;
  display: block;
}


.video-section .video-frame {
  width: 100%;
  max-width: 100%;
}

.video-section .video-frame .video-element {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
}

.timeline .container {
  max-width: 900px;
}

.timeline-list {
  position: relative;
  margin: 3rem auto 0;
  padding-left: 0;
}

.timeline-list::before {
  content: "";
  position: absolute;
  left: 40px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: rgba(255, 255, 255, 0.18);
}

.timeline-item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 1.5rem;
  margin-bottom: 2.5rem;
  padding-left: 80px;
}

.timeline-item::before {
  content: "";
  position: absolute;
  left: 40px;
  top: 12px;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: #111;
  border: 2px solid rgba(255, 255, 255, 0.8);

  
  transform: translateX(-7.5px) translateY(27px);
}

.timeline-media {
  width: 110px;
  flex-shrink: 0;
  display: flex;
  justify-content: center;
}

.timeline-media img {
  max-width: 100%;
  height: auto;
  border-radius: 0.75rem;
}

.timeline-placeholder {
  width: 80px;
  height: 80px;
  border-radius: 0.75rem;
  border: 1px dashed rgba(255, 255, 255, 0.3);
}

.timeline-content {
  flex: 1;
  max-width: 100%;
}

.timeline-date {
  font-size: 0.875rem;
  opacity: 0.8;
  margin: 0 0 0.25rem;
}

.timeline-title {
  margin: 0 0 0.5rem;
  font-size: 1.1rem;
}

.timeline-text {
  font-size: 0.95rem;
  line-height: 1.5;
}

@media (max-width: 640px) {
  .timeline-list::before {
    left: 24px;
  }

  .timeline-item {
    padding-left: 60px;
    flex-direction: row;
  }

  .timeline-item::before {
    left: 24px;
  }

  .timeline-media {
    width: 80px;
  }
}
