@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400;1,9..144,500&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

  :root{
    --paper:#faf9f6;
    --paper-2:#f2f0ea;
    --ink:#111110;
    --charcoal:#2b2b28;
    --mist:#83837c;
    --stone:#e4e1da;
    --line:#d7d3c9;
    --dur:.6s;
    --ease:cubic-bezier(.22,.61,.36,1);
  }

  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--paper);
    color:var(--ink);
    font-family:'Inter',sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
    position:relative;
  }

  body::before{
    content:"";
    position:fixed; inset:0;
    pointer-events:none;
    z-index:999;
    opacity:.035;
    mix-blend-mode:multiply;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  a{color:inherit; text-decoration:none;}
  ul{list-style:none;}
  button{font-family:inherit; cursor:pointer;}
  img,iframe{display:block; max-width:100%;}

  ::selection{background:var(--ink); color:var(--paper);}
  :focus-visible{outline:2px solid var(--ink); outline-offset:3px;}

  .eyebrow{
    font-family:'IBM Plex Mono',monospace;
    font-size:11px;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:var(--mist);
  }

  h1,h2,h3{
    font-family:'Fraunces',serif;
    font-weight:500;
    letter-spacing:-.01em;
    line-height:1.05;
  }

  .wrap{
    max-width:1180px;
    margin:0 auto;
    padding:0 32px;
  }

  /* ---------- NAV ---------- */
  header.nav{
    position:fixed; top:0; left:0; right:0;
    z-index:500;
    isolation:isolate;
    background:rgba(250,249,246,.82);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  .nav-topbar-inner{
    max-width:1180px; margin:0 auto; padding:0 32px;
    height:84px;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    column-gap:20px;
    position:relative;
  }
  .brand{
    font-family:'Fraunces',serif;
    font-size:21px;
    font-weight:600;
    letter-spacing:.01em;
  }
  .brand span{font-style:italic; font-weight:400; color:var(--mist);}
  .brand-logo{
    display:flex;
    align-items:center;
    justify-self:center;
    height:52px;
    max-width:180px;
    flex-shrink:0;
  }
  .brand-logo img{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center;
  }

  .contact-actions{
    justify-self:start;
    display:flex;
    align-items:center;
    gap:8px;
  }
  .contact-icon-btn{
    width:34px; height:34px;
    display:inline-flex;
    align-items:center; justify-content:center;
    border:1px solid var(--line);
    border-radius:50%;
    color:var(--ink);
    background:var(--paper);
    transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
  }
  .contact-icon-btn:hover{background:var(--ink); color:var(--paper); border-color:var(--ink); transform:translateY(-1px);}
  .contact-icon-btn svg{width:16px; height:16px; fill:currentColor;}

  .nav-right{
    justify-self:end;
    display:flex;
    align-items:center;
    gap:18px;
  }
  .icon-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:32px; height:32px;
    background:none; border:none;
    color:var(--ink);
    flex-shrink:0;
  }
  .icon-btn svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.5;}

  .language-switcher{
    display:flex;
    align-items:center;
    gap:5px;
    border:1px solid var(--line);
    padding:4px 6px;
    font-size:11px;
    letter-spacing:.06em;
    line-height:1;
    flex-shrink:0;
  }
  .lang-btn{
    appearance:none;
    border:0;
    background:transparent;
    padding:4px 5px;
    cursor:pointer;
    color:var(--mist);
    font:inherit;
    letter-spacing:inherit;
  }
  .lang-btn.active{
    color:var(--ink);
    font-weight:600;
  }

  /* Animated Search Container */
  .search-container {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--paper);
    border-bottom: 1px solid var(--line);
    padding: 16px 32px;
    z-index: -1; 
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    
    /* Animation base state */
    opacity: 0;
    visibility: hidden;
    transform: translateY(-20px);
    transition: opacity 0.35s var(--ease), transform 0.35s var(--ease), visibility 0.35s;
  }
  .search-container.open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
  .search-input-wrap {
    max-width: 1180px;
    margin: 0 auto;
    position: relative;
    display: flex;
    align-items: center;
  }
  .search-input-wrap input {
    width: 100%;
    padding: 12px 16px 12px 40px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    background: var(--paper-2);
    border: 1px solid var(--line);
    color: var(--ink);
    border-radius: 2px;
  }
  .search-input-wrap input:focus {
    border-color: var(--ink);
    outline: none;
  }
  .search-input-wrap svg {
    position: absolute;
    left: 12px;
    width: 18px;
    height: 18px;
    stroke: var(--mist);
    fill: none;
    stroke-width: 1.5;
  }
  .search-results-dropdown {
    max-width: 1180px;
    margin: 8px auto 0;
    max-height: 300px;
    overflow-y: auto;
  }
  .search-result-item {
    padding: 10px 12px;
    border-bottom: 1px solid var(--stone);
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    font-size: 13px;
  }
  .search-result-item:hover {
    background: var(--paper-2);
  }

  nav.links{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:40px;
    height:52px;
    border-top:1px solid var(--line);
    max-width:1180px;
    margin:0 auto;
    padding:0 32px;
  }
  nav.links a{
    font-size:13px;
    letter-spacing:.03em;
    text-transform:uppercase;
    font-weight:500;
    position:relative;
    padding:4px 0;
  }
  nav.links a::after{
    content:"";
    position:absolute; left:0; bottom:0;
    width:0%; height:1px; background:var(--ink);
    transition:width .35s var(--ease);
  }
  nav.links a:hover::after, nav.links a.active::after{width:100%;}
  nav.links a.active{color:var(--ink);}

  .burger{display:none; flex-direction:column; gap:5px; background:none; border:none;}
  .burger span{width:22px; height:1px; background:var(--ink); display:block;}

  /* ---------- PAGES / ROUTING ---------- */
  .page{
    display:none;
    padding-top:137px;
    animation:pagein var(--dur) var(--ease);
  }
  .page.active{display:block;}
  @keyframes pagein{
    from{opacity:0; transform:translateY(10px);}
    to{opacity:1; transform:translateY(0);}
  }
  @media (prefers-reduced-motion:reduce){
    .page{animation:none;}
    *{scroll-behavior:auto !important;}
  }

  section{padding:96px 0;}
  .divider{border-top:1px solid var(--line);}

  /* ---------- PLATE ---------- */
  .plate{
    position:relative;
    aspect-ratio:4/5;
    border-radius:2px;
    overflow:hidden;
    filter:grayscale(1) contrast(1.05);
  }
  .plate::before{
    content:"";
    position:absolute; inset:0;
    background-image:var(--g);
    background-blend-mode:overlay, normal;
  }
  .plate::after{
    content:"";
    position:absolute; inset:-6%;
    background:var(--paper);
    -webkit-mask-image:radial-gradient(ellipse at center, transparent 42%, black 78%);
    mask-image:radial-gradient(ellipse at center, transparent 42%, black 78%);
  }
  .plate.wide{aspect-ratio:16/10;}
  .plate.square{aspect-ratio:1/1;}

  .g1{--g:radial-gradient(circle at 30% 30%, #050505, transparent 60%), radial-gradient(circle at 75% 70%, #9a9a92, transparent 55%), linear-gradient(160deg,#3a3a36,#e7e4dc);}
  .g2{--g:radial-gradient(circle at 70% 25%, #0a0a0a, transparent 55%), radial-gradient(circle at 20% 80%, #b7b4ab, transparent 60%), linear-gradient(200deg,#4a4a45,#eeece5);}
  .g3{--g:conic-gradient(from 140deg at 50% 50%, #111 0deg, #cfccc3 90deg, #3a3a36 180deg, #f1efe8 270deg, #111 360deg);}
  .g4{--g:radial-gradient(circle at 50% 20%, #060606, transparent 50%), linear-gradient(120deg,#8f8c83,#f3f1ea 60%);}
  .g5{--g:radial-gradient(ellipse at 20% 60%, #0d0d0d, transparent 50%), radial-gradient(ellipse at 80% 30%, #a7a49b, transparent 55%), linear-gradient(190deg,#282825,#e9e6de);}
  .g6{--g:radial-gradient(circle at 60% 60%, #050505, transparent 45%), conic-gradient(from 30deg,#e8e5dd,#3d3d38,#e8e5dd);}
  .g7{--g:radial-gradient(circle at 40% 70%, #0c0c0c, transparent 50%), linear-gradient(100deg,#c7c4bb,#2f2f2b 70%);}
  .g8{--g:radial-gradient(circle at 65% 35%, #0a0a0a, transparent 55%), radial-gradient(circle at 25% 75%, #b0ada4, transparent 55%), linear-gradient(150deg,#333330,#efece5);}
  .g9{--g:conic-gradient(from 200deg at 50% 50%,#0a0a0a,#dedad0,#4c4c47,#f2efe8,#0a0a0a);}

  /* ---------- HOME ---------- */
  .hero{
    min-height:88vh;
    display:flex; align-items:center;
    padding-top:96px; padding-bottom:64px;
  }
  .hero-grid{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:64px;
    align-items:center;
  }
  .hero h1{
    font-size:clamp(40px,6vw,78px);
    max-width:11ch;
  }
  .hero h1 em{font-style:italic; color:var(--mist); font-weight:400;}
  .hero p.lede{
    margin-top:28px;
    font-size:17px;
    color:var(--charcoal);
    max-width:44ch;
    line-height:1.6;
  }
  .cta-row{display:flex; gap:18px; margin-top:40px; flex-wrap:wrap;}
  .btn{
    display:inline-flex; align-items:center; gap:10px;
    padding:14px 26px;
    border:1px solid var(--ink);
    font-size:13px; letter-spacing:.04em; text-transform:uppercase; font-weight:500;
    transition:background .3s var(--ease), color .3s var(--ease);
  }
  .btn.primary{background:var(--ink); color:var(--paper);}
  .btn.primary:hover{background:var(--charcoal);}
  .btn.ghost:hover{background:var(--ink); color:var(--paper);}

  .section-head{
    display:flex; justify-content:space-between; align-items:flex-end;
    gap:24px; margin-bottom:48px; flex-wrap:wrap;
  }
  .section-head h2{font-size:clamp(28px,3.4vw,40px);}
  .grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
  .grid-2{display:grid; grid-template-columns:1fr 1fr; gap:28px;}

  .card{
    opacity:0; transform:translateY(24px);
    transition:opacity .7s var(--ease), transform .7s var(--ease);
  }
  .card.in{opacity:1; transform:translateY(0);}
  .prod-name{margin-top:18px; font-family:'Fraunces',serif; font-size:19px;}
  .prod-meta{
    display:flex; justify-content:space-between; margin-top:6px;
    font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--mist); letter-spacing:.05em;
  }

  /* ---------- HIGHLIGHTS ---------- */
  .highlights{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-bottom:88px;}
  .highlight-card{
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:4px;
    padding:40px 32px;
    text-align:center;
    transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
  }
  .highlight-card:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 40px -22px rgba(17,17,16,.28);
    border-color:var(--ink);
  }
  .highlight-icon{
    width:56px; height:56px; margin:0 auto 22px;
    border-radius:50%;
    background:var(--stone);
    display:flex; align-items:center; justify-content:center;
    color:var(--ink);
    transition:background .35s var(--ease);
  }
  .highlight-card:hover .highlight-icon{background:var(--paper-2);}
  .highlight-icon svg{width:24px; height:24px;}
  .highlight-card h3{font-size:18px; margin-bottom:10px;}
  .highlight-card p{color:var(--charcoal); font-size:14px; line-height:1.65;}

  /* ---------- BANNER SLIDER ---------- */
  .banner-slider-section{padding:0 0 88px;}
  .banner-slider{
    position:relative;
    width:100%;
    aspect-ratio:16/7;
    overflow:hidden;
    border-radius:4px;
    border:1px solid var(--line);
    background:var(--paper-2);
  }
  .banner-slide{
    position:absolute; inset:0;
    opacity:0;
    transition:opacity 1.1s var(--ease);
    pointer-events:none;
  }
  .banner-slide.active{opacity:1; pointer-events:auto;}
  .banner-slide img{
    width:100%; height:100%;
    object-fit:cover;
    object-position:center;
    display:block;
  }
  .banner-dots{
    position:absolute; left:0; right:0; bottom:16px;
    display:flex; justify-content:center; gap:8px;
    z-index:2;
  }
  .banner-dot{
    width:8px; height:8px; border-radius:50%;
    border:1px solid rgba(255,255,255,.9);
    background:rgba(255,255,255,.4);
    padding:0; flex-shrink:0;
    transition:background .3s var(--ease), transform .3s var(--ease);
  }
  .banner-dot.active{background:#fff; transform:scale(1.25);}
  .banner-dot:hover{background:rgba(255,255,255,.75);}

  .strip{
    padding:80px 0;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .strip .wrap{display:grid; grid-template-columns:.9fr 1.1fr; gap:64px; align-items:center;}
  .strip h2{font-size:clamp(26px,3vw,36px); max-width:14ch;}
  .strip p{color:var(--charcoal); line-height:1.7; max-width:52ch; margin-top:18px;}

  /* ---------- ABOUT ---------- */
  .page-head{padding:150px 0 64px; border-bottom:1px solid var(--line);}
  .page-head h1{font-size:clamp(38px,5vw,58px); max-width:14ch;}
  .page-head p{margin-top:22px; max-width:52ch; color:var(--charcoal); font-size:16px; line-height:1.6;}

  .principles{display:grid; grid-template-columns:repeat(3,1fr); gap:0;}
  .principle{padding:36px; border-left:1px solid var(--line);}
  .principle:first-child{border-left:none;}
  .principle .eyebrow{margin-bottom:16px;}
  .principle h3{font-size:22px; margin-bottom:12px;}
  .principle p{color:var(--charcoal); font-size:14.5px; line-height:1.65;}

  .about-split{display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center;}
  .about-split p{color:var(--charcoal); line-height:1.75; margin-top:18px;}

  /* ---------- PRODUCTS ---------- */
  .filters{display:flex; gap:10px; margin-bottom:44px; flex-wrap:wrap;}
  .chip{
    padding:9px 18px; border:1px solid var(--line);
    font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.04em; text-transform:uppercase;
    transition:.25s var(--ease);
  }
  .chip.active, .chip:hover{background:var(--ink); color:var(--paper); border-color:var(--ink);}
  .prod-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:32px 28px;}
  .prod-card{cursor:pointer;}
  .product-photo{
    background:#fff;
    filter:none;
    border:1px solid var(--line);
  }
  .product-photo::before,.product-photo::after{display:none;}
  .product-photo img{
    width:100%; height:100%;
    object-fit:contain;
    object-position:center;
    padding:8px;
    background:#fff;
  }

  /* modal */
  .modal-bg{
    position:fixed; inset:0; background:rgba(17,17,16,.72);
    z-index:800; display:none; align-items:center; justify-content:center;
    padding:32px;
  }
  .modal-bg.open{display:flex;}
  .modal{
    background:var(--paper); max-width:880px; width:100%;
    display:grid; grid-template-columns:1fr 1fr; gap:0;
    max-height:86vh; overflow:auto; position:relative;
  }
  .modal .plate{aspect-ratio:auto; height:100%; min-height:340px;}
  .modal-body{padding:44px;}
  .modal-close{
    position:absolute; top:26px; right:26px;
    width:36px; height:36px; border:1px solid var(--ink); background:var(--paper);
    display:flex; align-items:center; justify-content:center; font-size:16px; z-index:10; cursor:pointer;
  }
  .modal-inner{position:relative; width:100%; display:contents;}
  .modal-body h3{font-size:28px; margin:14px 0 18px;}
  .modal-body p{color:var(--charcoal); line-height:1.7; margin-bottom:28px;}
  
  .modal-actions{display:flex; flex-direction:column; gap:16px; align-items:flex-start; margin-top:24px;}
  .modal-icon-group{display:flex; gap:12px; align-items:center;}
  .modal-icon-btn{
    display:inline-flex; align-items:center; justify-content:center;
    width:44px; height:44px; border:1px solid var(--ink); border-radius:50%;
    color:var(--ink); background:var(--paper); transition:background .2s, color .2s;
  }
  .modal-icon-btn:hover{background:var(--ink); color:var(--paper);}
  .modal-icon-btn svg{width:20px; height:20px; fill:currentColor;}

  /* ---------- CONTACT ---------- */
  .locations{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
  .loc-card{border:1px solid var(--line);}
  .map-wrap{position:relative; aspect-ratio:4/3; overflow:hidden; border-bottom:1px solid var(--line);}
  .map-wrap iframe{width:100%; height:100%; border:0;}
  .map-open-btn{
    position:absolute; top:12px; left:12px; z-index:2;
    display:inline-flex; align-items:center; gap:6px;
    background:var(--paper); border:1px solid var(--line);
    padding:7px 12px;
    font-family:'IBM Plex Mono',monospace;
    font-size:10.5px; letter-spacing:.05em; text-transform:uppercase;
    color:var(--ink);
    transition:background var(--dur) var(--ease), color var(--dur) var(--ease), border-color var(--dur) var(--ease);
  }
  .map-open-btn:hover{background:transparent; color:var(--mist); border-color:transparent;}
  .map-open-btn svg{width:11px; height:11px; flex-shrink:0;}
  .loc-body{padding:26px;}
  .loc-city{font-family:'Inter',sans-serif; font-weight:700; font-size:15px; letter-spacing:.03em; text-transform:uppercase; margin-bottom:12px;}
  .loc-detail{font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:var(--charcoal); line-height:1.8;}
  .loc-detail .addr-label{color:var(--ink); font-weight:600; letter-spacing:.04em;}

  .contact-form{max-width:640px; margin-top:64px;}
  .form-row{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px;}
  .field{display:flex; flex-direction:column; gap:8px;}
  .field.full{grid-column:1/-1;}
  .field label{font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--mist);}
  .field input, .field textarea{
    background:transparent; border:none; border-bottom:1px solid var(--line);
    padding:10px 2px; font-family:'Inter',sans-serif; font-size:15px; color:var(--ink);
  }
  .field input:focus, .field textarea:focus{border-color:var(--ink);}
   .field textarea{resize:none; min-height:120px;}
  .form-msg{margin-top:20px; font-size:13.5px; color:var(--charcoal); display:none;}
  .form-msg.show{display:block;}

  footer{
    padding:56px 0; border-top:1px solid var(--line);
    display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;
  }
  footer .eyebrow{color:var(--mist);}
  .social-links{
    display:flex;
    align-items:center;
    gap:10px;
  }
  .social-link{
    width:38px;
    height:38px;
    border:1px solid var(--line);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
  }
  .social-link:hover{
    background:var(--ink);
    color:var(--paper);
    border-color:var(--ink);
  }
  .social-link svg{width:17px;height:17px;fill:currentColor;}
  .footer-phone{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-size:12px;
    letter-spacing:.03em;
    white-space:nowrap;
  }
  .footer-phone svg{width:14px;height:14px;fill:currentColor;}

  /* ---------- RESPONSIVE ---------- */
  @media (max-width:860px){
    nav.links{
      position:fixed;
      top:0;
      right:0;
      left:auto;
      width:min(86vw, 360px);
      height:100dvh;
      min-height:100vh;
      background:var(--paper);
      flex-direction:column;
      align-items:stretch;
      justify-content:flex-start;
      padding:104px 32px 40px;
      gap:28px;
      border-top:none;
      border-left:1px solid var(--line);
      box-shadow:-20px 0 50px rgba(17,17,16,.10);
      transform:translate3d(105%,0,0);
      transition:transform .4s var(--ease);
      will-change:transform;
      z-index:600;
      overflow-y:auto;
    }
    nav.links.open{transform:translate3d(0,0,0);}
    nav.links a{font-size:15px; padding:10px 0;}
    
    /* Mobile Header Layout */
    .nav-topbar-inner{
      display: flex;
      justify-content: space-between;
      align-items: center;
      height: 72px;
      padding: 0 20px;
    }
    .contact-actions{display:none;}
    .brand-logo { margin: 0; height:56px; max-width:190px; }
    
    .language-switcher{
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      margin:0;
    }
    
    .nav-right{
      display:flex;
      align-items:center;
      gap:14px;
    }
    .search-btn{
      display:inline-flex;
      margin:0;
    }
    .burger{
      display:flex;
      position:relative;
      z-index:610;
      margin:0;
    }
    
    .page{padding-top:72px;}
    .search-container {padding: 12px 20px;}
    
    .nav-scrim{
      position:fixed;
      inset:0;
      background:rgba(17,17,16,.24);
      opacity:0;
      visibility:hidden;
      pointer-events:none;
      transition:opacity .4s var(--ease), visibility 0s linear .4s;
      z-index:450;
    }
    .nav-scrim.show{
      opacity:1;
      visibility:visible;
      pointer-events:auto;
      transition:opacity .4s var(--ease);
    }
    body.menu-open{overflow:hidden;}
    footer{padding:40px 0;}

    .hero-grid, .grid-3, .grid-2, .principles, .about-split, .prod-grid, .locations, .strip .wrap, .highlights{
      grid-template-columns:1fr;
    }
    .principle{border-left:none; border-top:1px solid var(--line); padding:28px 0;}
    .principle:first-child{border-top:none;}

    /* Banner slider: taller ratio on narrow screens, edge-to-edge */
    .banner-slider-section{padding-bottom:56px;}
    .banner-slider-section .wrap{padding:0;}
    .banner-slider{aspect-ratio:4/3.4; border-radius:0; border-left:none; border-right:none;}

    /* Center the About / Products / Contact page headings on mobile */
    .page-head{text-align:center;}
    .page-head h1, .page-head p, .page-head .eyebrow{margin-left:auto; margin-right:auto;}

    .modal{grid-template-columns:1fr;}
    .modal .plate{min-height:220px;}
    .modal-body{padding:24px;}
    .modal-close{top:12px; right:12px; width:32px; height:32px;}
    
    .form-row{grid-template-columns:1fr;}
    section{padding:64px 0;}
  }

  /* ---------- PRODUCT REDESIGN (SUPPLIED PRODUCT PHOTOS ONLY) ---------- */
  .prod-grid{gap:24px;}
  .prod-card{
    border:1px solid var(--line);
    padding:14px;
    background:rgba(255,255,255,.32);
    transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
  }
  .prod-card:hover{transform:translateY(-4px); border-color:var(--ink); box-shadow:0 18px 40px rgba(17,17,16,.08);}
  .prod-card .prod-name{margin:18px 2px 9px; font-size:20px; line-height:1.18;}
  .prod-card .prod-meta{padding:0 2px 2px;}
  .product-photo{
    aspect-ratio:4/3;
    background:#fff;
    border:1px solid var(--line);
    filter:none;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .product-photo img{
    width:100%; height:100%; object-fit:contain; object-position:center;
    padding:10px; background:#fff;
  }
  .product-placeholder{
    aspect-ratio:4/3;
    border:1px solid var(--line);
    background:linear-gradient(135deg,#f6f5f1,#e8e6df);
    filter:none;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    padding:18px;
  }
  .product-placeholder::before,.product-placeholder::after{display:none !important;}
  .product-mark{
    width:42px;height:42px;border:1px solid var(--ink);
    display:grid;place-items:center;
    font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.08em;
  }
  .product-code{
    align-self:flex-end;
    font-family:'IBM Plex Mono',monospace;
    font-size:11px;letter-spacing:.08em;color:var(--muted);
    text-transform:uppercase;
  }
  .prod-card:has(.product-photo){background:#fff;}
  .modal .product-placeholder{min-height:340px;}
  @media (max-width:860px){
    .prod-grid{gap:16px;}
    .prod-card{padding:12px;}
    .prod-card .prod-name{font-size:18px;margin-top:14px;}
    .product-placeholder,.product-photo{aspect-ratio:16/10;}
    .modal .product-placeholder{min-height:220px;}
  }


   /* ---------- CONTACT QUICK ACTIONS / DARK MODE ---------- */
   .contact-quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 0 28px;}
   .contact-quick-card{min-height:94px;border:1px solid var(--line);display:flex;align-items:center;gap:16px;padding:18px 20px;background:transparent;transition:transform .25s var(--ease),border-color .25s var(--ease),background .25s var(--ease);}
   .contact-quick-card:hover{transform:translateY(-2px);border-color:var(--ink);}
   .contact-quick-icon{width:44px;height:44px;flex:0 0 44px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;}
   .contact-quick-icon svg{width:20px;height:20px;fill:currentColor;stroke:currentColor;}
   .contact-quick-card strong{display:block;font-size:15px;letter-spacing:.03em;margin-bottom:5px;}
   .contact-quick-card span{display:block;font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--mist);}

   .theme-toggle{width:64px;height:32px;padding:4px;border-radius:999px;display:inline-flex;align-items:center;justify-content:space-between;border:1px solid var(--line);background:var(--paper);color:var(--ink);position:relative;flex-shrink:0;transition:.3s var(--ease);}
   .theme-toggle .theme-thumb{position:absolute;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--stone);left:3px;transition:transform .3s var(--ease),background .3s var(--ease);z-index:2;}
   .theme-toggle .theme-thumb svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;}
   .theme-toggle .theme-sun,.theme-toggle .theme-moon{width:18px;height:18px;display:grid;place-items:center;z-index:1;opacity:.55;}
   .theme-toggle .theme-sun svg,.theme-toggle .theme-moon svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;}
   body.dark{--paper:#111110;--paper-2:#1b1b19;--ink:#f4f1e9;--charcoal:#d6d2c9;--mist:#a9a59b;--stone:#292925;--line:#3b3a35;}
   body.dark header.nav{background:rgba(17,17,16,.86);}
   body.dark .theme-toggle{background:#080808;border-color:#353530;}
   body.dark .theme-toggle .theme-thumb{transform:translateX(32px);background:#2b2b28;}
   body.dark .theme-sun{opacity:.35;}
   body.dark .product-photo,body.dark .product-photo img,body.dark .prod-card:has(.product-photo){background:#f7f7f5;}
   .nav-theme-mobile{display:none;margin-top:18px;padding-top:18px;border-top:1px solid var(--line);}

   @media(max-width:860px){
     .contact-quick-actions{grid-template-columns:1fr;gap:12px;margin-bottom:20px;}
     .contact-quick-card{min-height:88px;padding:16px;}
     .nav-right .theme-toggle{display:none;}
     .nav-theme-mobile{display:flex;align-items:center;justify-content:space-between;}
     .nav-theme-mobile .theme-toggle{display:inline-flex;}
   }


/* ---------- REFINEMENT PATCH: HEADER / CONTACT / ABOUT / DARK MODE ---------- */
.brand-logo{height:60px;max-width:215px;}
.nav-topbar-inner{height:88px;}
.page{padding-top:141px;}

/* Search and theme controls are intentionally ordered for better visual balance. */
.nav-right{gap:14px;}
.nav-right .search-btn{order:1;}
.nav-right .theme-toggle{order:2;}
.nav-right .language-switcher{order:3;}
.nav-right .burger{order:4;}

/* Keep map action visible without the heavy rectangular box behind it. */
.map-open-btn{background:transparent !important;border:0 !important;box-shadow:none !important;padding:8px 4px !important;color:#222 !important;text-shadow:0 1px 2px rgba(255,255,255,.9);font-weight:600;}
.map-open-btn:hover{background:transparent !important;border:0 !important;color:#111 !important;}
body.dark .map-open-btn{color:#f5f1e8 !important;text-shadow:0 1px 2px rgba(0,0,0,.85);}

/* Contact page repair */
.contact-quick-actions{gap:18px;margin:0 0 34px;}
.contact-quick-card{min-height:96px;padding:20px 22px;background:var(--paper);}
.contact-quick-icon{width:48px;height:48px;flex-basis:48px;border-color:var(--line);}
.contact-quick-icon svg{width:21px;height:21px;}
.contact-quick-icon .wa-icon{fill:currentColor;stroke:none;}
.contact-quick-icon .phone-icon{fill:none;stroke:currentColor;stroke-width:2;}
.contact-quick-card > span:last-child{min-width:0;}
.contact-quick-card strong{font-family:'Inter',sans-serif;font-size:15px;}
.contact-quick-card > span > span{font-family:'IBM Plex Mono',monospace;font-size:11px;line-height:1.45;}
.locations{gap:24px;}
.loc-card{background:var(--paper);}
.map-wrap{background:var(--paper-2);}

/* Message box must remain fixed and non-resizable. */
.field textarea{resize:none;min-height:128px;height:128px;max-height:128px;overflow-y:auto;}

/* About page redesign */
.about-hero-copy{max-width:900px;font-size:18px;line-height:1.75;color:var(--charcoal);}
.about-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);gap:64px;align-items:start;}
.about-copy{display:grid;gap:28px;}
.about-copy p{font-size:16px;line-height:1.85;color:var(--charcoal);}
.about-side{border-left:1px solid var(--line);padding-left:34px;display:grid;gap:30px;position:sticky;top:170px;}
.about-metric{padding-bottom:24px;border-bottom:1px solid var(--line);}
.about-metric:last-child{border-bottom:0;padding-bottom:0;}
.about-metric strong{display:block;font-family:'Fraunces',serif;font-size:clamp(36px,4vw,54px);font-weight:500;line-height:1;}
.about-metric span{display:block;margin-top:8px;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mist);}
.about-focus{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.about-focus-item{padding:34px 28px;border-left:1px solid var(--line);}
.about-focus-item:first-child{border-left:0;}
.about-focus-item h3{font-size:22px;margin:12px 0;}
.about-focus-item p{font-size:14px;line-height:1.7;color:var(--charcoal);}

/* Dark mode contrast repair: product cards stay readable and no white-on-white text. */
body.dark .prod-card{background:#1a1a18 !important;border-color:#393833;}
body.dark .prod-card:has(.product-photo){background:#1a1a18 !important;}
body.dark .product-photo,body.dark .product-photo img{background:#f7f7f5 !important;}
body.dark .prod-card .prod-name{color:var(--ink) !important;}
body.dark .prod-card .prod-meta{color:var(--mist) !important;}
body.dark .loc-card,body.dark .contact-quick-card{background:#171715;}
body.dark .map-wrap{background:#1c1c19;}

@media(max-width:860px){
  .nav-topbar-inner{height:76px;}
  .page{padding-top:76px;}
  .brand-logo{height:52px;max-width:180px;}
  .language-switcher{font-size:10px;}
  .nav-right{gap:9px;}
  .about-layout{grid-template-columns:1fr;gap:42px;}
  .about-side{position:static;border-left:0;border-top:1px solid var(--line);padding:26px 0 0;grid-template-columns:repeat(3,1fr);gap:14px;}
  .about-metric{border-bottom:0;padding:0;}
  .about-metric strong{font-size:32px;}
  .about-focus{grid-template-columns:1fr;}
  .about-focus-item{border-left:0;border-top:1px solid var(--line);padding:28px 0;}
  .about-focus-item:first-child{border-top:0;}
}
@media(max-width:520px){
  .brand-logo{height:46px;max-width:155px;}
  .nav-right .search-btn{width:30px;height:30px;}
  .about-side{grid-template-columns:1fr;}
  .about-metric{padding-bottom:18px;border-bottom:1px solid var(--line);}
  .about-metric:last-child{border-bottom:0;}
}


/* ========== FINAL QA PATCH — CONTACT / MAPS / LOGO / DARK MODE / RESPONSIVE ========== */
:root{color-scheme:light;}
body.dark{color-scheme:dark;}

/* Larger logo without breaking the three-column header layout */
.brand-logo{height:68px!important;max-width:250px!important;}
.brand-logo img{object-fit:contain!important;width:100%!important;height:100%!important;}
body.dark .brand-logo img{filter:none!important;opacity:1!important;}

/* Desktop order: theme first, search second for a cleaner hierarchy */
.nav-right .theme-toggle{order:1!important;}
.nav-right .search-btn{order:2!important;}

/* Contact quick actions: stable icon sizing and typography */
.contact-quick-actions{align-items:stretch!important;}
.contact-quick-card{min-width:0!important;overflow:hidden!important;}
.contact-quick-card>span:last-child{display:block!important;min-width:0!important;}
.contact-quick-card strong{color:var(--ink)!important;line-height:1.25!important;}
.contact-quick-card>span:last-child>span{display:block!important;color:var(--mist)!important;line-height:1.5!important;margin-top:4px!important;}
.contact-quick-icon{display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important;}
.contact-quick-icon svg{display:block!important;width:22px!important;height:22px!important;max-width:22px!important;max-height:22px!important;flex:none!important;}
.contact-quick-icon .wa-icon{fill:currentColor!important;stroke:none!important;}
.contact-quick-icon .phone-icon{fill:none!important;stroke:currentColor!important;}

/* Remove our duplicate map control. The Google Maps embed keeps a single native action. */
.map-wrap>.map-open-btn{display:inline-flex!important;}
.map-wrap{isolation:isolate!important;background:var(--paper-2)!important;}
.map-wrap iframe{display:block!important;position:relative!important;z-index:1!important;}

/* Dark-mode QA */
body.dark .product-photo{background:#f7f7f5!important;}
body.dark .product-photo img{background:#f7f7f5!important;}
body.dark .loc-card,body.dark .contact-quick-card{background:#171715!important;}
body.dark .loc-detail{color:var(--charcoal)!important;}
body.dark .about-copy,body.dark .about-focus-item p{color:var(--charcoal)!important;}
body.dark .search-container{background:var(--paper)!important;}
body.dark .search-results-dropdown{background:var(--paper)!important;border-color:var(--line)!important;}

/* Footer contact pair always remains phone + WhatsApp */
footer .contact-actions{display:flex!important;align-items:center!important;gap:8px!important;}
footer .contact-actions .contact-icon-btn:nth-child(2) svg{fill:currentColor!important;}

/* Responsive QA */
@media (max-width:860px){
  .nav-topbar-inner{height:76px!important;padding:0 18px!important;grid-template-columns:1fr auto 1fr!important;column-gap:8px!important;}
  .brand-logo{height:58px!important;max-width:190px!important;}
  .contact-actions{gap:6px!important;}
  .contact-icon-btn{width:32px!important;height:32px!important;}
  .nav-right{gap:10px!important;}
  .nav-right .theme-toggle{display:none!important;}
  .nav-right .search-btn{display:inline-flex!important;order:1!important;}
  .language-switcher{display:none!important;}
  .locations{grid-template-columns:1fr!important;gap:18px!important;}
  .map-wrap{aspect-ratio:16/10!important;}
  .loc-body{padding:20px!important;}
  .contact-quick-card{padding:16px 18px!important;}
}
@media (max-width:520px){
  .nav-topbar-inner{height:70px!important;padding:0 12px!important;}
  .brand-logo{height:50px!important;max-width:150px!important;}
  .contact-icon-btn{width:30px!important;height:30px!important;}
  .contact-actions{gap:5px!important;}
  .nav-right{gap:6px!important;}
  .burger{margin-left:0!important;}
  .contact-quick-actions{gap:12px!important;}
  .contact-quick-card{min-height:82px!important;gap:14px!important;padding:14px!important;}
  .contact-quick-icon{width:44px!important;height:44px!important;flex-basis:44px!important;}
  .contact-quick-card strong{font-size:14px!important;}
  .contact-quick-card>span:last-child>span{font-size:10.5px!important;}
  .locations{gap:14px!important;}
}


/* ========== SEPT 2026 RESPONSIVE + I18N FINAL PATCH ========== */
.brand-logo{height:76px!important;max-width:270px!important;}
.nav-right .search-btn{order:1!important}.nav-right .theme-toggle{order:2!important}
@media(max-width:860px){
 .nav-topbar-inner{display:grid!important;grid-template-columns:1fr auto 1fr!important;align-items:center!important;}
 .contact-actions{display:flex!important;justify-self:start!important;}
 .brand-logo{justify-self:center!important;height:62px!important;max-width:210px!important;}
 .nav-right{justify-self:end!important;}
 .nav-right .language-switcher{display:none!important;}
 .prod-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;}
 .prod-card{padding:10px!important;}
 .prod-card .prod-name{font-size:15px!important;margin:10px 0 6px!important;}
 .prod-meta{font-size:9px!important;gap:4px!important;flex-wrap:wrap!important;}
 #navLinks .language-switcher{display:flex!important;position:static!important;transform:none!important;margin-top:10px!important;width:max-content;}
}
@media(max-width:520px){.brand-logo{height:54px!important;max-width:170px!important}.contact-icon-btn{width:28px!important;height:28px!important}.contact-icon-btn svg{width:14px!important;height:14px!important}.prod-grid{gap:10px!important}.product-photo,.product-placeholder{aspect-ratio:1/1!important}}


/* ========== FINAL POLISH PATCH — LOGO / LANGUAGE / MAP / WHATSAPP ========== */
/* Larger logo on desktop while preserving the centered three-column header. */
.nav-topbar-inner{height:96px!important;}
.brand-logo{height:84px!important;max-width:300px!important;}
.page{padding-top:149px!important;}

/* The language bar must not sit beside the horizontal navigation. */
#navLinks > .nav-language-switcher{display:none!important;}

/* Only one map action is shown: keep the native Google Maps control and hide our duplicate overlay. */
.map-wrap > .map-open-btn{display:none!important;}

/* Exact same WhatsApp silhouette used in the header/footer. */
footer .contact-actions .contact-icon-btn:nth-child(2) svg{fill:currentColor!important;stroke:none!important;}

@media(max-width:860px){
  .nav-topbar-inner{height:82px!important;padding:0 16px!important;}
  .brand-logo{height:68px!important;max-width:225px!important;}
  .page{padding-top:82px!important;}
  #navLinks > .nav-language-switcher{
    display:flex!important;
    position:static!important;
    transform:none!important;
    margin-top:18px!important;
    margin-bottom:0!important;
    width:max-content!important;
    order:20!important;
  }
  #navLinks > .nav-theme-mobile{order:21!important;margin-top:10px!important;}
}
@media(max-width:520px){
  .nav-topbar-inner{height:76px!important;padding:0 10px!important;column-gap:4px!important;}
  .brand-logo{height:60px!important;max-width:185px!important;}
  .page{padding-top:76px!important;}
  .contact-icon-btn{width:28px!important;height:28px!important;}
  .contact-actions{gap:4px!important;}
}


/* ========== FINAL MICRO PATCH — LOGO / ISTANBUL MAP / MOBILE FOOTER ========== */
/* Slightly larger logo while preserving the existing three-column header structure. */
.nav-topbar-inner{height:104px!important;}
.brand-logo{height:90px!important;max-width:320px!important;}
.page{padding-top:157px!important;}

@media(max-width:860px){
  .nav-topbar-inner{height:88px!important;padding:0 16px!important;}
  .brand-logo{height:74px!important;max-width:235px!important;}
  .page{padding-top:88px!important;}
  /* Header contact icons stay available; footer phone/WhatsApp are desktop only. */
  footer .contact-actions{display:none!important;}
}
@media(max-width:520px){
  .nav-topbar-inner{height:80px!important;padding:0 10px!important;column-gap:4px!important;}
  .brand-logo{height:66px!important;max-width:min(205px,calc(100vw - 145px))!important;}
  .page{padding-top:80px!important;}
  footer .contact-actions{display:none!important;}
}



/* ========== BANNER + HERO FINAL LAYOUT PATCH ========== */
/* Banners are the first content users see, directly below the fixed navigation. */
#page-home{padding-top:104px!important;}
#page-home .banner-slider-section{padding:0 0 56px!important;}
#page-home .banner-slider-section .wrap{max-width:none;padding:0!important;}
#page-home .banner-slider{width:100%;aspect-ratio:16/6.3;border-radius:0;border-left:0;border-right:0;}
#page-home .banner-slider{touch-action:pan-y;cursor:grab;user-select:none;}
#page-home .banner-slider.is-dragging{cursor:grabbing;}
#page-home .banner-slide img{object-fit:cover;object-position:center;}
#page-home .hero{min-height:auto;padding:52px 0 76px!important;}
.hero-media{
  width:100%;
  aspect-ratio:4/5;
  overflow:hidden;
  background:var(--paper-2);
  border:1px solid var(--line);
}
.hero-media img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;}
@media(max-width:860px){
  #page-home{padding-top:88px!important;}
  #page-home .banner-slider-section{padding-bottom:34px!important;}
  #page-home .banner-slider{aspect-ratio:16/8.5;border-radius:0!important;}
  #page-home .hero{padding:34px 0 56px!important;}
  .hero-grid{gap:32px!important;}
  .hero-media{aspect-ratio:4/3;}
  .hero-media img{object-position:center center;}
}
@media(max-width:520px){
  #page-home{padding-top:80px!important;}
  #page-home .banner-slider{aspect-ratio:16/10;}
  #page-home .hero{padding:28px 0 46px!important;}
  .hero-media{aspect-ratio:1/1;}
}


/* ========== FINAL BANNER + SUPPLY IMAGE FIT PATCH ========== */
/* Banner: centered, contained, never cropped or stretched outside its frame. */
#page-home .banner-slider-section{
  padding:24px 0 56px!important;
}
#page-home .banner-slider-section .wrap{
  max-width:1180px!important;
  margin:0 auto!important;
  padding:0 32px!important;
}
#page-home .banner-slider{
  width:100%!important;
  max-width:1120px!important;
  margin:0 auto!important;
  aspect-ratio:16/7!important;
  border:1px solid var(--line)!important;
  border-radius:4px!important;
  background:var(--paper-2)!important;
  overflow:hidden!important;
}
#page-home .banner-slide{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
#page-home .banner-slide img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:contain!important;
  object-position:center center!important;
  background:var(--paper-2)!important;
}

/* Replace the former grey placeholder with the supplied laboratory photograph. */
.supply-image{
  width:100%;
  aspect-ratio:1200/773;
  overflow:hidden;
  background:var(--paper-2);
  border:1px solid var(--line);
}
.supply-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
}

@media(max-width:860px){
  #page-home .banner-slider-section{padding:16px 0 34px!important;}
  #page-home .banner-slider-section .wrap{padding:0 18px!important;}
  #page-home .banner-slider{
    max-width:none!important;
    aspect-ratio:16/9!important;
    border-radius:3px!important;
  }
  .supply-image{aspect-ratio:1200/773;}
}
@media(max-width:520px){
  #page-home .banner-slider-section{padding:12px 0 28px!important;}
  #page-home .banner-slider-section .wrap{padding:0 12px!important;}
  #page-home .banner-slider{aspect-ratio:16/10!important;}
  .supply-image{aspect-ratio:4/3;}
  .supply-image img{object-position:center center;}
}

/* ---------- EXTERNALIZED INLINE STYLES / CONTACT FORM ---------- */
.contact-form-eyebrow{margin-bottom:24px;}
.form-honeypot{
  position:absolute!important;
  left:-10000px!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
}
.contact-form button[type="submit"]:disabled{
  opacity:.6;
  cursor:wait;
}
.form-msg.error{
  color:#9b2c2c;
}
body.dark .form-msg.error{
  color:#ff9b9b;
}