/* ---- Mobile polish overrides (safe, non-destructive) ---- */
:root{
  --header-h: 64px;
}
@media (max-width: 768px){
  header, .header, .site-header{
    position: sticky;
    top: 0;
    z-index: 999;
    backdrop-filter: blur(8px);
  }
  .nav-wrap, nav, .main-nav{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }
  /* Language switcher keeps its fixed safe layout from i18n.js; no changes here */

  /* Injected hamburger */
  .hamburger{
    display:inline-flex; align-items:center; justify-content:center;
    width:40px; height:40px; border-radius:12px;
    border:1px solid rgba(255,255,255,.15);
    background: rgba(0,0,0,.35); backdrop-filter: blur(6px);
  }
  .hamburger span{ display:block; width:20px; height:2px; background:#fff; position:relative; }
  .hamburger span::before, .hamburger span::after{ content:''; position:absolute; left:0; width:100%; height:2px; background:#fff; }
  .hamburger span::before{ top:-6px } .hamburger span::after{ top:6px }

  /* Menu layer */
  .nav-menu{
    position: fixed;
    left: max(12px, env(safe-area-inset-left));
    right: max(12px, env(safe-area-inset-right));
    top: calc(var(--header-h) + max(8px, env(safe-area-inset-top)));
    display:none; flex-direction: column; gap:10px;
    background: rgba(8,18,14,.9);
    border:1px solid rgba(255,255,255,.08);
    border-radius: 16px;
    padding: 14px;
    box-shadow: 0 10px 30px rgba(0,0,0,.35);
  }
  .nav-menu.show{ display:flex }

  /* Ensure hero section stacks nicely */
  .hero.two-col, .two-col, .grid.two-col{
    display:block !important;
  }
  .hero.two-col .left, .hero.two-col .right,
  .two-col .left, .two-col .right{
    width:100%; max-width:100%; margin:0 !important;
  }
  .hero, .hero-fit{
    min-height: auto !important;
    padding-top: 24px !important;
  }
}
/* ===== Mobile Centered Layout Enhancements (v5) ===== */
@media (max-width: 768px){
  /* Hero headings & paragraphs */
  .hero h1, .hero .title, .hero h2, .two-col .title { 
    text-align: center !important; 
    line-height: 1.15 !important;
    letter-spacing: -0.2px;
  }
  .hero p, .two-col p { 
    text-align: center !important; 
    max-width: 30ch; 
    margin-left: auto !important; 
    margin-right: auto !important;
  }

  /* Chips / tags */
  .chips, .chip-list {
    display: flex; flex-wrap: wrap; gap: 8px; 
    justify-content: center !important;
  }

  /* Call-to-action buttons */
  .hero-cta, .cta-row {
    display: flex; flex-wrap: wrap; gap: 12px; 
    justify-content: center !important;
  }
  .hero-cta a, .hero-cta button, .cta-row a, .cta-row button {
    min-width: 180px;
  }

  /* Stats grid equal sizing */
  .stat-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(140px, 1fr));
    gap: 12px !important;
    align-items: stretch;
    justify-items: stretch;
  }
  .stat-grid > * { width: 100% !important; }

  /* Section paddings */
  .section, section { padding-left: 16px; padding-right: 16px; }

  /* Cards equalization in lists */
  .cards, .card-list { display: grid; grid-template-columns: 1fr; gap: 14px; }
  @media (min-width: 480px) and (max-width: 768px){
    .cards, .card-list { grid-template-columns: repeat(2, minmax(0,1fr)); }
  }

  /* Footer quick links center */
  .footer-links, .quick-links { text-align: center; }
}
/* ===== v6 Mobile Mock Layout (as 4-screen reference) ===== */
@media (max-width: 768px){
  /* Header strip: hamburger left, logo right */
  header, .header, .site-header{
    position: sticky; top:0; z-index:999;
    display:flex; align-items:center; gap:12px;
    padding: 10px 14px;
    background: linear-gradient(180deg, rgba(8,18,14,0.96), rgba(8,18,14,0.80));
  }
  /* try common logo hooks */
  header .logo, .brand, .site-logo, header img[alt*="Marslan"]{
    margin-left:auto !important;
  }
  /* ensure CTA sits below on mobile (not in header) */
  header .cta, header .cta-wrap{ display:none !important; }

  /* Lang switcher: pin top-right under logo so it won't overlap */
  .lang-switcher.inline{ position: static !important; }
  .lang-switcher.fixed{
    position: fixed !important;
    right: max(10px, env(safe-area-inset-right));
    left: auto;
    top: calc(10px + env(safe-area-inset-top));
  }

  /* Page titles & sections */
  .page-title, .section-title, .hero h1, .hero .title, h1, h2{
    text-align:center !important;
    line-height:1.15 !important;
    margin-left:auto !important; margin-right:auto !important;
    max-width: 22ch;
  }
  .hero p, .lead, .intro, .section > p, .section .intro{
    text-align:center !important;
    max-width: 34ch;
    margin-left:auto !important; margin-right:auto !important;
  }

  /* Services list as centered stacked cards */
  .services, .service-list, .cards.services, .service-cards{
    display:grid !important; grid-template-columns:1fr; gap:12px;
    margin-top:8px;
  }
  .services .card, .service-list .card, .service-cards .card, .service, .card.service{
    padding: 14px 16px; border-radius: 16px;
  }

  /* Projects cards */
  .projects, .project-list, .cards.projects{
    display:grid !important; grid-template-columns:1fr; gap:14px;
  }
  @media (min-width:480px) and (max-width:768px){
    .services, .service-list, .project-list, .cards.projects{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  }

  /* Contact form: single column, neat spacing */
  .contact-form form{
    display:grid; grid-template-columns:1fr; gap:12px;
  }
  .contact-form .row{ display:block !important; }
  .contact-form input, .contact-form select, .contact-form textarea{ width:100% !important; }

  /* Stats: two columns equal */
  .stat-grid{ display:grid !important; grid-template-columns: repeat(2, minmax(0,1fr)); gap:12px !important; }
  .stat-grid > *{ width:100% !important; }

  /* Section paddings uniform */
  section, .section{ padding: 20px 16px !important; }
}
/* ===== v6a header enforce (logo right, menu left) ===== */
@media (max-width: 768px){
  header, .header, .site-header{ display:flex; align-items:center; }
  .hamburger{ order: 0; margin-right: 8px; }
  /* push logo to the far right */
  header .logo, .brand, .site-logo, header img[alt*="Marslan"]{ margin-left:auto !important; order: 2; }
  /* language switcher just below header, aligned right */
  .lang-switcher.fixed{
    position: fixed !important;
    top: calc(56px + env(safe-area-inset-top));
    right: max(10px, env(safe-area-inset-right));
    left: auto;
    z-index: 10000;
  }
}
/* ===== v6b header swap: logo left, menu right (mobile only) ===== */
@media (max-width: 768px){
  header, .header, .site-header{ display:flex; align-items:center; }
  /* logo first on the left */
  header .logo, .brand, .site-logo, header img[alt*="Marslan"]{ margin-right:auto !important; margin-left:0 !important; order: 0; }
  /* hamburger last on right */
  .hamburger{ order: 3; margin-left: 8px; }

  /* Stat grid: 2 items top, 3rd centered full width below */
  .stat-grid{
    display:grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr));
    grid-template-areas:
      "statA statB"
      "statC statC";
    gap: 12px !important;
  }
  .stat-grid > *:nth-child(1){ grid-area: statA; }
  .stat-grid > *:nth-child(2){ grid-area: statB; }
  .stat-grid > *:nth-child(3){ grid-area: statC; width:100% !important; }
  .stat-grid > *{ justify-self: stretch; align-self: stretch; }
}


/* ===== v6c: robust header row ===== */
@media (max-width: 768px){
  header, .header, .site-header{ display:flex !important; flex-direction:row !important; align-items:center !important; }
}


/* ===== v6d: Services & Projects mobile polish ===== */
@media (max-width: 768px){
  /* Global container safety */
  .container, main, .content, .wrapper{
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  /* Service detail panels (like AI Panel) */
  .service-panel, .ai-panel, .panel, .feature-panel{
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 16px auto !important;
    box-sizing: border-box !important;
  }
  .service-panel .row, .ai-panel .row{ display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
  .service-panel .col, .ai-panel .col{ width: 100% !important; }

  /* Input controls inside service panels */
  .service-panel input, .service-panel select, .service-panel textarea,
  .ai-panel input, .ai-panel select, .ai-panel textarea{
    width: 100% !important;
  }

  /* Project cards */
  .projects, .project-list, .project-cards, .cards.projects{
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 14px !important;
  }
  @media (min-width:480px) and (max-width:768px){
    .projects, .project-list, .project-cards, .cards.projects{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  }
  .project-card, .card.project{
    display: flex; flex-direction: column; gap: 8px;
    width: 100% !important; max-width: 100% !important;
  }
  .project-card img, .card.project img{
    width: 100% !important; height: auto !important; border-radius: 12px;
  }
  .project-card h3, .card.project h3, .project-card p, .card.project p{
    text-align: left; word-break: break-word; overflow-wrap: anywhere;
  }

  /* Equalize buttons and chips within sections */
  .btn-row{ display:flex; flex-wrap: wrap; gap:12px; justify-content:center; }
  .chip-row{ display:flex; flex-wrap: wrap; gap:8px; justify-content:center; }

  /* Extra: ensure WhatsApp floater doesn't overlap bottom content excessively */
  .floating-whatsapp{ bottom: 18px !important; right: 18px !important; }
}


/* ===== v6e: Service pages mobile fit refinements ===== */
@media (max-width: 768px){
  /* Ensure hero/service blocks don't bleed outside */
  .hero, .two-col, .two-col.hero-fit, .service-hero{
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box;
  }

  /* The big service panel card (AI Panel, Mobil Panel, Entegrasyon vb.) */
  .ai-panel, .service-panel, .panel.service, .panel.ai, .panel.mobile, .panel.integration{
    max-width: 100% !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    transform: none !important;   /* olası scale/translate kaldır */
    left: auto !important; right: auto !important;
  }

  /* İç grid tek kolona inmeli, taşma olmamalı */
  .ai-panel .grid, .service-panel .grid, .panel .grid,
  .ai-panel .row,  .service-panel .row,  .panel .row{
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  /* Form alanları %100 */
  .ai-panel input, .ai-panel select, .ai-panel textarea,
  .service-panel input, .service-panel select, .service-panel textarea,
  .panel input, .panel select, .panel textarea{
    width: 100% !important;
  }

  /* Badge/feature butonları alt alta sığsın */
  .features, .feature-list, .feature-grid{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 10px;
  }
  @media (max-width: 420px){
    .features, .feature-list, .feature-grid{ grid-template-columns: 1fr; }
  }

  /* Panel alt ipucu metni içeri sığsın */
  .panel .hint, .ai-panel .hint, .service-panel .hint{
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  /* Görsel/code-şeması gibi yanda duran bloklar tam genişlik alsın */
  .img-card, .code-card, .illustration, .diagram{
    width: 100% !important;
    max-width: 100% !important;
  }
}


/* ===== v6f: Mobile drawer cleanup & nested Services ===== */
@media (max-width: 768px){
  .mobile-drawer, .mobile-menu, .nav-drawer{
    width: 100vw !important;
    max-width: 100vw !important;
    left: 0 !important;
    right: 0 !important;
    padding: 12px 16px !important;
    box-sizing: border-box !important;
  }
  .mobile-drawer .nav-list, .mobile-menu .nav-list{
    display: flex; flex-direction: column; gap: 10px;
  }
  .nav-item{ display:block; }
  .nav-item > a, .nav-item > button{
    display:flex; align-items:center; justify-content:space-between;
    width:100%; padding:12px 14px; border-radius:12px;
    background: rgba(255,255,255,0.05);
    text-align:left;
  }
  .nav-item--submenu{ padding-left: 8px; }
  .nav-sublist{ display:none; flex-direction:column; gap:8px; padding:8px 0 0 0; }
  .nav-item.open .nav-sublist{ display:flex; }
  /* prevent page behind from scrolling when menu open */
  body.menu-open{ overflow:hidden; }
}


/* ===== v6g: Homepage horizontal lanes & Services stacking ===== */
@media (max-width: 768px){

  /* Homepage horizontal lanes (yatay) */
  /* Hizmetlerimiz kart şeridi */
  .services .cards, .services .grid, .services .lane{
    display: flex !important;
    gap: 12px !important;
    overflow-x: auto !important;
    padding-bottom: 8px !important;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  .services .cards > *, .services .grid > *, .services .lane > *{
    flex: 0 0 78% !important;          /* geniş, okunabilir kart */
    scroll-snap-align: start;
    max-width: 78% !important;
  }

  /* Seçili Proje Hikayeleri yatay şerit */
  .projects.section .cards, .section.projects .cards, .selected-projects .cards{
    display:flex !important; gap:12px !important; overflow-x:auto !important;
    scroll-snap-type:x mandatory; padding-bottom:8px !important;
  }
  .projects.section .cards > *, .section.projects .cards > *, .selected-projects .cards > *{
    flex:0 0 82% !important; max-width:82% !important; scroll-snap-align:start;
  }

  /* Neden Marslan? fayda kutuları yatay şerit */
  .why .cards, .why .grid, .why .benefits{
    display:flex !important; gap:12px !important; overflow-x:auto !important;
    scroll-snap-type:x mandatory; padding-bottom:8px !important;
  }
  .why .cards > *, .why .grid > *, .why .benefits > *{
    flex:0 0 82% !important; max-width:82% !important; scroll-snap-align:start;
  }

  /* Services pages: stack left then right, full width */
  .two-col, .service-two-col, .layout-two-col{
    display:block !important;
  }
  .two-col > .left, .service-two-col > .left, .layout-two-col > .left,
  .two-col > .col-left, .two-col > :first-child{
    order:1; width:100% !important; max-width:100% !important;
    margin:0 0 16px 0 !important;
  }
  .two-col > .right, .service-two-col > .right, .layout-two-col > .right,
  .two-col > .col-right, .two-col > :last-child{
    order:2; width:100% !important; max-width:100% !important;
    margin:0 !important;
  }
  /* ensure inner panels are visible and not clipped */
  .two-col .panel, .two-col .ai-panel, .two-col .service-panel{
    transform:none !important; left:auto !important; right:auto !important;
    width:100% !important; max-width:100% !important;
  }

  /* Generic overflow guards */
  .section{ overflow-x:hidden !important; }
}


/* ===== v6h: stronger homepage 'Hizmetlerimiz' lane + services stack ===== */
@media (max-width: 768px){

  /* --- HOMEPAGE: Hizmetlerimiz yatay şerit --- */
  /* section.services bloğunun ilk grid/kart kapsayıcılarını yataya çevir */
  section.services .grid,
  section.services .cards,
  section.services .services-grid,
  .section.services .grid,
  .section.services .cards{
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:12px !important;
    overflow-x:auto !important;
    padding: 6px 0 10px !important;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
  }
  /* tek tek kartlar sabit genişlikte olsun, taşma yapmasın */
  section.services .grid > *, section.services .cards > *,
  .section.services .grid > *, .section.services .cards > *{
    flex:0 0 78% !important;
    max-width:78% !important;
    scroll-snap-align:start;
  }
  /* kart içi tipografi sarma ve taşma koruması */
  section.services .grid *, section.services .cards *{
    white-space:normal !important;
    overflow-wrap: anywhere;
  }

  /* --- SERVICES PAGES: iki kolon -> alt alta, görünürlük tam --- */
  .service-hero, .service, .service-page, .hero.service, .service-two-col{
    overflow:visible !important;
  }
  .service-hero .two-col, .service-hero .grid, .service-hero .columns,
  .service .two-col, .service .grid, .service .columns,
  .layout-two-col, .two-col.hero-fit{
    display:block !important;
  }
  /* sol içerik üstte */
  .service-hero .left, .service .left, .columns .left, .col-left, .two-col > :first-child{
    width:100% !important; max-width:100% !important;
    margin:0 0 16px 0 !important; order:1;
    position:relative !important;
  }
  /* sağ panel altta ve tam genişlikte */
  .service-hero .right, .service .right, .columns .right, .col-right, .two-col > :last-child{
    width:100% !important; max-width:100% !important;
    margin:0 !important; order:2;
    position:relative !important;
  }
  /* panel/kart kesinlikle ölçekte/translate'te olmasın */
  .service-hero .panel, .service-hero .ai-panel, .service-hero .service-panel,
  .service .panel, .service .ai-panel, .service .service-panel{
    width:100% !important; max-width:100% !important;
    transform:none !important; left:auto !important; right:auto !important; top:auto !important;
  }
  /* chips/stat/rozet sıraları çok sütunluysa taşma yapmasın */
  .chips, .stat-grid, .feature-list, .feature-grid{
    display:grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap:10px !important;
  }
  @media (max-width:420px){
    .chips, .stat-grid, .feature-list, .feature-grid{ grid-template-columns: 1fr; }
  }
  /* Görsel/şema 100% */
  .service-hero .img-card, .service-hero .code-card, .service-hero .illustration{
    width:100% !important; max-width:100% !important;
  }
}


/* ===== v6i: ultra-robust selectors for homepage services & service pages ===== */
@media (max-width: 768px){

  /* ---------- HOMEPAGE: 'Hizmetlerimiz' yatay şerit (çok geniş kapsam) ---------- */
  /* Bölümü çok farklı biçimlerde yakala: id/classes/text-anchored yapılar */
  /* En yaygın: #services, section.services, [data-section="services"] */
  #services .container > .grid,
  #services .container > .cards,
  #services .grid,
  #services .cards,
  section.services .grid,
  section.services .cards,
  .section.services .grid,
  .section.services .cards,
  [data-section="services"] .grid,
  [data-section="services"] .cards,
  /* Yedek: başlık altındaki ilk liste */
  section:has(h2:matches(:contains("Hizmetlerimiz"), :contains("Hizmetler"), :contains("Services"))) .grid,
  section:has(h2:matches(:contains("Hizmetlerimiz"), :contains("Hizmetler"), :contains("Services"))) .cards {
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:12px !important;
    overflow-x:auto !important;
    padding:6px 0 10px !important;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
  }

  #services .grid > *, #services .cards > *,
  section.services .grid > *, section.services .cards > *,
  .section.services .grid > *, .section.services .cards > *,
  [data-section="services"] .grid > *, [data-section="services"] .cards > *,
  section:has(h2:matches(:contains("Hizmetlerimiz"), :contains("Hizmetler"), :contains("Services"))) .grid > *,
  section:has(h2:matches(:contains("Hizmetlerimiz"), :contains("Hizmetler"), :contains("Services"))) .cards > * {
    flex:0 0 78% !important;
    max-width:78% !important;
    scroll-snap-align:start;
  }

  /* Metin taşma koruması */
  #services .grid *, #services .cards *,
  section.services .grid *, section.services .cards *,
  .section.services .grid *, .section.services .cards *,
  [data-section="services"] .grid *, [data-section="services"] .cards * {
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }

  /* ---------- SERVICES PAGES: iki sütunu alt alta zorla ---------- */
  /* Sayfa tespiti: body id/class/data-page + tipik hero/two-col varyantları */
  body[class*="service"], body[id*="service"], body[data-page*="service"] *,
  .service-hero, .service-page, .hero.service, section[class*="service"] {
    overflow:visible !important;
  }

  /* Varyant tüm iki kolon düzenlerini tek blok yap */
  .two-col, .two-col.hero-fit, .two-col.hero, .columns, .grid.two-col, .grid.hero-fit, .layout-two-col, .service-two-col {
    display:block !important;
  }

  /* Soldaki içerik (ilk çocuk) -> üstte tam genişlik */
  .two-col > :first-child, .columns > :first-child, .layout-two-col > :first-child {
    order:1; width:100% !important; max-width:100% !important; margin:0 0 16px 0 !important; position:relative !important;
  }
  /* Sağdaki panel (son çocuk) -> altta tam genişlik */
  .two-col > :last-child, .columns > :last-child, .layout-two-col > :last-child {
    order:2; width:100% !important; max-width:100% !important; margin:0 !important; position:relative !important;
  }

  /* Panel içindeki kart/çerçeveleri de %100 yap, transform/absolute iptal */
  .panel, .ai-panel, .service-panel, .card-panel, .img-card, .code-card {
    width:100% !important; max-width:100% !important;
    transform:none !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important;
    position:relative !important;
  }

  /* Rozet/istatistik satırlarını 1–2 kolona kır; küçüldükçe 1 kolona düşsün */
  .chips, .stat-grid, .feature-list, .feature-grid, .badges, .tags-row {
    display:grid !important; gap:10px !important; grid-template-columns: repeat(2, minmax(0,1fr));
  }
  @media (max-width:420px){
    .chips, .stat-grid, .feature-list, .feature-grid, .badges, .tags-row { grid-template-columns: 1fr; }
  }
}

/* ===== v6k2: Centered, equal-width 'Hizmetlerimiz' cards on mobile ===== */
@media (max-width: 768px){
  /* Section spacing */
  section.services{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  /* Grid becomes single column and centered */
  section.services .services-grid,
  .section.services .services-grid{
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    justify-items: center !important;
    align-items: start !important;
    margin: 8px 0 0 0 !important;
  }
  /* Each card same width and centered */
  section.services .services-grid > *,
  .section.services .services-grid > *{
    width: min(92%, 560px) !important;
    max-width: 560px !important;
    margin: 0 auto !important;
  }
  /* Make media inside cards scale nicely */
  section.services .services-grid img,
  section.services .services-grid canvas,
  section.services .services-grid svg{
    max-width: 100% !important;
    height: auto !important;
  }
  /* Head: keep compact, centered vertically */
  section.services .services-head{
    margin-bottom: 10px !important;
  }
}

/* ===== v6m: Service pages mobile stacking (left block on top, panel below) ===== */
@media (max-width: 768px){
  /* Common hero containers used on service pages */
  section.ai-hero .ai-container,
  section.web-hero .ai-container,
  section.mobile-hero .ai-container,
  section.custom-hero .ai-container,
  section.qr-hero .ai-container,
  section.service-hero .service-container,
  .service-two-col, .service-two-col-fit{
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
  }
  /* Force first content block to appear first (top), panel second (bottom) */
  section.ai-hero .ai-container > *:nth-child(1),
  section.web-hero .ai-container > *:nth-child(1),
  section.mobile-hero .ai-container > *:nth-child(1),
  section.custom-hero .ai-container > *:nth-child(1),
  section.qr-hero .ai-container > *:nth-child(1){
    order: 1 !important;
    width: 100% !important;
  }
  section.ai-hero .ai-container > *:nth-child(2),
  section.web-hero .ai-container > *:nth-child(2),
  section.mobile-hero .ai-container > *:nth-child(2),
  section.custom-hero .ai-container > *:nth-child(2),
  section.qr-hero .ai-container > *:nth-child(2){
    order: 2 !important;
    width: 100% !important;
  }
  /* Cards inside both columns should stretch nicely */
  section.ai-hero .ai-container > * > *,
  section.web-hero .ai-container > * > *,
  section.mobile-hero .ai-container > * > *,
  section.custom-hero .ai-container > * > *,
  section.qr-hero .ai-container > * > *{
    max-width: 100% !important;
  }
  /* Reduce oversized paddings on mobile for these sections */
  section.ai-hero, section.web-hero, section.mobile-hero,
  section.custom-hero, section.qr-hero{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}
/* ===== v6m: Mobile-drawer language buttons ===== */
@media (max-width: 768px){
  .mobile-drawer .lang-inline{
    display: flex; gap: 8px; justify-content: center; margin: 8px 0 14px 0;
  }
  .mobile-drawer .lang-inline .btn-lang{
    font: inherit; border: 1px solid rgba(255,255,255,.15);
    background: rgba(0,0,0,.35); padding: 8px 10px; border-radius: 999px;
    color: #e7fff2; cursor: pointer;
  }
  .mobile-drawer .lang-inline .btn-lang.active{
    background: #10f77b; color: #07110a; border-color: #10f77b;
  }
}


/* === iOS/Safari mobile logo overlay fix === */
@supports (-webkit-touch-callout: none) {
  header.site-header { 
    position: sticky; top: 0;
    z-index: 9999 !important; 
    isolation: isolate; 
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    backface-visibility: hidden;
  }
  .site-header .brand img{
    position: relative;
    z-index: 10000 !important;
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
  }
  .site-header .brand::before,
  .site-header .brand::after,
  header .brand::before,
  header .brand::after { content:none !important; display:none !important; }
  #matrix{ z-index: 0 !important; }
  .gradient-overlay{ z-index: 1 !important; }
}
/* Keep logo left and hamburger right on all mobile */
@media (max-width: 991px){
  header.site-header .container.nav{
    display:flex; align-items:center; justify-content:space-between;
  }
  header.site-header .brand{ margin:0 !important; }
  header.site-header .hamburger{ margin-left:auto; }
}



/* === Uniform Mobile Layout (iOS + Android) === */
@media (max-width: 720px){
  html, body { 
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    font-size: 16px; /* prevent iOS zoom on inputs */
  }
  body{ margin:0; padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom); }
  .container{ width:100%; max-width:none; padding-left:16px; padding-right:16px; }
  .form-request{ max-width: 100%; margin: 20px auto; padding: 16px; }
  .form-request .row{ grid-template-columns: 1fr !important; gap: 12px; }
  .form-request input, .form-request select, .form-request textarea, .btn-primary, .btn-outline{
    min-height: 44px; /* Apple HIG touch target */
    line-height: 1.2;
    font-size: 16px;
  }
  header.site-header{ position: sticky; top: 0; }
  /* Ensure logo left / hamburger right remains consistent */
  header.site-header .container.nav{ display:flex; align-items:center; justify-content:space-between; }
}
/* Avoid layout differences on very small devices */
@media (max-width: 360px){
  .container{ padding-left:12px; padding-right:12px; }
  h1{ font-size: clamp(22px, 6vw, 28px); }
}
/* Normalize images/cards */
img{ max-width:100%; height:auto; }
.card{ box-sizing:border-box; }

