/*
Theme Name: NOSSA LAB
Theme URI: https://www.nossalab.com
Author: NOSSA LAB
Description: Tema custom per NOSSA LAB — sartoria contemporanea, Milano. Sviluppato su misura: hero video, sigillo di marca, doppia-S specchiata nel wordmark, e-commerce predisposto e nascosto fino al lancio.
Version: 1.0
Text Domain: nossa-lab
*/
:root{
    --white:#FFFFFF;
    --black:#0A0A0A;
    --grey:#84837D;
    --line:#E4E3DE;
    --seal:#C1272D;
    --off:#F5F4F1;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth; overflow-x:hidden; max-width:100%;}
  body{
    background:var(--white); color:var(--black);
    font-family:'Space Grotesk',sans-serif;
    font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
    overflow-x:hidden; max-width:100%;
  }
  .bebas{ font-family:'Bebas Neue',sans-serif; font-weight:400; letter-spacing:.01em; text-transform:uppercase; }
  .abril{ font-family:'Instrument Serif',serif; font-style:italic; font-weight:400; text-transform:none; letter-spacing:0; }
  video{ display:block; width:100%; height:100%; object-fit:cover; }
  a{color:inherit;text-decoration:none;}
  img{display:block;width:100%;height:100%;object-fit:cover;}
  .label{ font-family:'Space Grotesk'; font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--grey); font-weight:500; }
  .seal-red{ color:var(--seal); }

  .statement{
    position:relative; color:var(--white); padding:170px 48px; text-align:center;
    background-image:url('https://www.nossalab.com/wp-content/uploads/2025/10/GD4A0929-scaled.jpg');
    background-size:cover; background-position:center;
  }
  .statement::before{ content:""; position:absolute; inset:0; background:rgba(10,10,10,.6); filter:grayscale(1); }
  .statement > *{ position:relative; z-index:2; }
  .statement h2{ font-size:clamp(40px,7.5vw,120px); line-height:.94; }
  .statement p{ margin-top:26px; font-size:15px; color:#D8D6CE; max-width:460px; margin-left:auto; margin-right:auto; }

  /* --- energy pass: spinning seal --- */
  @media (prefers-reduced-motion: reduce){ .ticker-track{ animation:none; } }

  .spin-seal{ animation:spinSeal 18s linear infinite; }
  @keyframes spinSeal{ from{transform:rotate(0deg);} to{transform:rotate(360deg);} }
  @media (prefers-reduced-motion: reduce){ .spin-seal{ animation:none; } }

  /* wordmark treatment: the central "SS" in every "Nossa" / "Nossa Lab" mention
     is mirrored, matching the brand's own logo construction */
  .wm{ display:inline; }
  .ms{ display:inline-block; transform:scaleX(-1); }

  /* --- double-S seal mark, reused as brand seal / stamp / bullet --- */
  .seal{ display:inline-block; }
  .seal svg text{ font-family:'Bebas Neue'; }

  /* header */
  header{
    position:fixed; top:0; left:0; right:0; z-index:100;
    display:flex; align-items:center; justify-content:space-between;
    padding:20px 48px; background:var(--white);
    border-bottom:1px solid transparent;
    transition:border-color .3s ease;
  }
  header.solid{ border-color:var(--line); }
  .logo-lockup{ display:flex; align-items:center; gap:14px; }
  .nav-wrap{ display:flex; align-items:center; gap:36px; }
  .account-link{ display:flex; align-items:center; justify-content:center; color:var(--black); opacity:.75; transition:opacity .2s ease; }
  .account-link:hover{ opacity:1; }
  .logo-lockup .seal svg{ width:26px; height:26px; }
  .logo-stack{ line-height:.78; }
  .logo-stack .l1{ font-size:26px; display:block; }
  .logo-stack .rule{ width:100%; height:3px; background:var(--black); margin:2px 0; }
  .logo-stack .l2{ font-size:26px; display:block; }
  nav ul{ display:flex; gap:36px; list-style:none; }
  nav a{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:500; position:relative; }
  .nav-tag{ font-family:'Space Grotesk'; font-size:8px; letter-spacing:.08em; text-transform:uppercase; color:var(--seal); border:1px solid var(--seal); padding:2px 5px; margin-left:6px; vertical-align:middle; font-weight:600; }
  .brand-chip{
    display:inline-flex; align-items:center; gap:8px; font-family:'Space Grotesk'; font-weight:600;
    font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--seal);
    border:1px solid var(--seal); padding:7px 16px; margin-bottom:22px;
  }
  nav a::after{ content:""; position:absolute; left:0; bottom:-6px; width:0; height:1px; background:var(--black); transition:width .25s ease; }
  nav a:hover::after{ width:100%; }

  /* mobile hamburger + slide-in nav panel */
  .menu-toggle{ display:none; flex-direction:column; justify-content:center; align-items:flex-end; gap:5px; width:28px; height:22px; background:none; border:none; cursor:pointer; padding:0; z-index:120; }
  .menu-toggle span{ display:block; width:100%; height:2px; background:var(--black); transition:transform .25s ease, opacity .2s ease, width .25s ease; }
  body.nav-open .menu-toggle span:nth-child(1){ transform:translateY(7px) rotate(45deg); width:100%; }
  body.nav-open .menu-toggle span:nth-child(2){ opacity:0; }
  body.nav-open .menu-toggle span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); width:100%; }
  .nav-backdrop{ position:fixed; inset:0; background:rgba(10,10,10,.4); opacity:0; pointer-events:none; transition:opacity .3s ease; z-index:108; }
  body.nav-open .nav-backdrop{ opacity:1; pointer-events:auto; }
  body.nav-open{ overflow:hidden; }

  @media (max-width:900px){
    .menu-toggle{ display:flex; }
    .nav-wrap nav{
      position:fixed; top:0; right:0; bottom:0; width:78vw; max-width:340px;
      background:var(--white); box-shadow:-10px 0 30px rgba(0,0,0,.12);
      padding:110px 32px 40px; transform:translateX(100%);
      transition:transform .35s ease; z-index:109; overflow-y:auto;
    }
    body.nav-open .nav-wrap nav{ transform:translateX(0); }
    nav ul{ flex-direction:column; gap:26px; align-items:flex-start; }
    nav a{ font-size:15px; }
  }

  /* hero — split layout: video column (the lab, in motion) + dark text column */
  .hero{ height:100vh; min-height:680px; position:relative; display:flex; }
  .hero-media{ width:42%; position:relative; overflow:hidden; flex-shrink:0; }
  .hero-media video{ filter:grayscale(1) contrast(1.06) brightness(.94); position:absolute; inset:0; opacity:0; transition:opacity 1s ease; }
  .hero-media video.active{ opacity:1; }
  .hero-media::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, transparent 70%, rgba(10,10,10,.35) 100%); z-index:2; }
  .hero-text{ flex:1; background:var(--black); color:var(--white); position:relative; display:flex; flex-direction:column; justify-content:flex-end; padding:0 48px 56px; }
  .hero-headline{ color:var(--white); }
  .hero-headline .label{ color:#8A8983; margin-bottom:18px; }
  .hero-headline h1{ font-size:clamp(44px,7.2vw,108px); line-height:.86; letter-spacing:-.01em; }
  .hero-tag{ color:var(--white); margin-top:26px; max-width:380px; }
  .hero-tag p{ font-size:14px; color:#B6B5AE; }
  .hero-seal{ position:absolute; top:40px; right:48px; z-index:6; opacity:.9; }
  .hero-seal svg{ width:44px; height:44px; color:var(--white); }
  .scroll-cue{ position:absolute; bottom:24px; left:48px; z-index:6; color:var(--white); font-size:11px; letter-spacing:.2em; text-transform:uppercase; opacity:.8; display:flex; align-items:center; gap:10px; }
  .scroll-cue::after{ content:""; width:40px; height:1px; background:var(--white); opacity:.7; }

  @media (max-width:900px){
    .hero{ flex-direction:column; height:auto; min-height:0; }
    .hero-media{ width:100%; height:46vh; }
    .hero-text{ padding:48px 22px 60px; }
  }

  section{ padding:140px 48px; }
  .section-inner{ max-width:1240px; margin:0 auto; }

  /* Grid columns default to min-width:auto, which stops them from ever
     shrinking below their content's natural width — this is what was
     forcing text (and the whole layout) wider than the phone screen.
     Forcing min-width:0 lets every column shrink to fit, wrapping text
     normally instead of pushing it off-screen. Applies to every
     two-column layout on the site (Manifesto, Lab, Nossa, Approccio,
     Contact, About story rows, Team profile). */
  .manifesto-grid, .manifesto-grid > *,
  .lab-cols, .lab-cols > *,
  .nossa-showcase, .nossa-showcase > *,
  .responsible-grid, .responsible-grid > *,
  .contact-grid, .contact-grid > *,
  .contact-page-grid, .contact-page-grid > *,
  .story-row, .story-row > *,
  .profile-grid, .profile-grid > *{
    min-width:0;
  }

  /* manifesto */
  .manifesto{ padding-top:120px; padding-bottom:60px; }
  .manifesto-grid{ display:grid; grid-template-columns:1fr 1.6fr; gap:60px; }
  .manifesto .label{ margin-bottom:24px; }
  .manifesto h2{ font-size:clamp(38px,5.6vw,90px); line-height:.92; }
  .manifesto-photo{ aspect-ratio:4/5; overflow:hidden; }
  .manifesto-photo img{ filter:grayscale(1) contrast(1.05); }
  .manifesto-side p{ font-size:16px; color:var(--grey); max-width:420px; }
  .manifesto-side p + p{ margin-top:16px; }
  .pull-quote{
    background-size:cover; background-position:center; position:relative;
    padding:150px 48px; text-align:center;
  }
  .pull-quote::before{ content:""; position:absolute; inset:0; background:rgba(10,10,10,.55); }
  .pull-quote-veil{ position:relative; z-index:2; }
  .pull-quote blockquote{ color:var(--white); font-size:clamp(32px,4.8vw,64px); line-height:1.2; max-width:840px; margin:0 auto; }
  .pull-quote cite{ display:block; margin-top:24px; font-style:normal; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:#D8D6CE; }

  /* LAB — inverted contemporary block */
  .lab-block{ background:var(--black); color:var(--white); }
  .lab-top{ display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:80px; gap:30px; flex-wrap:wrap; }
  .lab-top h2{ font-size:clamp(36px,5vw,72px); }
  .lab-top .label{ color:#8A8983; }
  .lab-cols{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:#242422; }
  .lab-col{ background:var(--black); padding:56px 50px; }
  .lab-col-head{ display:flex; align-items:center; gap:14px; margin-bottom:28px; }
  .lab-col-head .seal svg{ width:22px; height:22px; color:var(--seal); }
  .lab-col-head h3{ font-size:30px; }
  .lab-col ul{ list-style:none; }
  .lab-col li{ font-family:'Space Grotesk'; font-size:15.5px; color:#B6B5AE; padding:12px 0; line-height:1.5; }

  .process-strip{ margin-top:1px; display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:#242422; }
  .process-step{ position:relative; aspect-ratio:3/4; padding:24px; display:flex; flex-direction:column; justify-content:flex-end; background-size:cover; background-position:center; }
  .process-step::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,10,10,.15) 30%, rgba(10,10,10,.92) 100%); filter:grayscale(1); }
  .process-step > *{ position:relative; z-index:2; }
  .process-step .n{ font-family:'Bebas Neue'; font-size:36px; color:var(--seal); line-height:1; margin-bottom:10px; }
  .process-step h4{ font-family:'Space Grotesk'; font-weight:600; font-size:14.5px; color:var(--white); margin-bottom:6px; }
  .process-step p{ font-size:12px; color:#C9C7C0; }

  /* NOSSA brand — the quiet, japanese-minimal register */
  .nossa-brand{ padding-top:160px; padding-bottom:160px; }
  .nossa-top{ text-align:center; margin-bottom:100px; }
  .nossa-top .seal{ margin-bottom:20px; }
  .nossa-top .seal svg{ width:34px; height:34px; }
  .nossa-top h2{ font-size:clamp(44px,7vw,110px); }
  .nossa-top p{ margin-top:14px; color:var(--grey); font-size:14px; letter-spacing:.06em; }
  .nossa-showcase{ display:grid; grid-template-columns:0.9fr 1.4fr; gap:40px; align-items:stretch; border:1px solid var(--line); }
  .nossa-img{ aspect-ratio:3/4; position:relative; overflow:hidden; }
  .nossa-img img, .nossa-img video{ filter:grayscale(.3); }
  .nossa-tag{
    position:absolute; bottom:22px; left:22px; background:var(--white);
    padding:10px 14px; display:flex; align-items:center; gap:10px;
    font-family:'Space Grotesk'; font-size:11px; letter-spacing:.1em;
  }
  .nossa-tag .seal svg{ width:16px; height:16px; color:var(--seal); }
  .nossa-copy{ padding:70px; display:flex; flex-direction:column; justify-content:center; border-left:1px solid var(--line); }
  .nossa-copy .label{ margin-bottom:22px; }
  .nossa-copy h3{ font-size:clamp(28px,3.4vw,44px); line-height:1.05; margin-bottom:26px; }
  .nossa-copy p{ color:var(--grey); font-size:15px; max-width:400px; overflow-wrap:break-word; word-wrap:break-word; }
  .nossa-copy .meta-row{ display:flex; gap:40px; margin-top:40px; padding-top:24px; border-top:1px solid var(--line); }
  .nossa-copy .meta-row div span{ display:block; }
  .nossa-copy .meta-row .k{ font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--grey); margin-bottom:6px; }
  .nossa-copy .meta-row .v{ font-family:'Bebas Neue'; font-size:22px; }

  /* editorial grid */
  .grid-head{ display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:56px; gap:24px; flex-wrap:wrap; }
  .grid-head h2{ font-size:clamp(36px,5vw,72px); }
  .grid-head p{ color:var(--grey); font-size:14px; max-width:300px; }
  .editorial-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:var(--line); }
  .editorial-grid .item{ position:relative; aspect-ratio:3/4; overflow:hidden; background:var(--white); cursor:pointer; }
  .editorial-grid .item img{ filter:grayscale(1); transition:filter .5s ease, transform .6s cubic-bezier(.2,.8,.2,1); }
  .editorial-grid .item:hover img{ filter:grayscale(0); transform:scale(1.08) rotate(-1.4deg); }
  .editorial-grid .item:nth-child(even):hover img{ transform:scale(1.08) rotate(1.4deg); }
  .editorial-grid .item .tag{
    position:absolute; left:14px; bottom:14px; background:var(--white); padding:6px 10px;
    font-family:'Space Grotesk'; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase;
    opacity:0; transform:translateY(6px); transition:.3s ease;
  }
  .editorial-grid .item:hover .tag{ opacity:1; transform:translateY(0); }

  /* Archivio lightbox */
  .lightbox{
    display:none; position:fixed; inset:0; z-index:200; background:rgba(10,10,10,.95);
    align-items:center; justify-content:center;
  }
  .lightbox.active{ display:flex; }
  .lightbox-img{ max-width:82vw; max-height:78vh; object-fit:contain; box-shadow:0 20px 60px rgba(0,0,0,.4); }
  .lightbox-caption{
    position:absolute; bottom:36px; left:0; right:0; text-align:center;
    color:var(--white); font-family:'Space Grotesk'; font-size:13px; letter-spacing:.1em; text-transform:uppercase;
  }
  .lightbox-close{
    position:absolute; top:24px; right:32px; background:none; border:none; color:var(--white);
    font-size:36px; line-height:1; cursor:pointer; font-family:sans-serif;
  }
  .lightbox-arrow{
    position:absolute; top:50%; transform:translateY(-50%); background:none; border:none; color:var(--white);
    font-size:48px; line-height:1; cursor:pointer; padding:12px 18px; opacity:.75; transition:opacity .2s ease;
  }
  .lightbox-arrow:hover{ opacity:1; }
  .lightbox-prev{ left:12px; }
  .lightbox-next{ right:12px; }
  @media (max-width:700px){
    .lightbox-arrow{ font-size:32px; padding:8px 12px; }
    .lightbox-close{ top:14px; right:18px; font-size:28px; }
  }

  .btn{
    display:inline-flex; align-items:center; gap:10px; font-family:'Space Grotesk'; font-weight:600;
    font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; padding:16px 30px; border:1px solid var(--black);
    transition:.25s ease;
  }
  .btn:hover{ background:var(--black); color:var(--white); }
  .btn.on-dark{ border-color:var(--white); color:var(--white); }
  .btn.on-dark:hover{ background:var(--white); color:var(--black); }
  .btn-row{ margin-top:48px; display:flex; justify-content:center; }

  /* responsible */
  .responsible-grid{ display:grid; grid-template-columns:0.8fr 1fr; gap:60px; align-items:center; }
  .responsible .label{ margin-bottom:22px; }
  .responsible h2{ font-size:clamp(34px,4.6vw,60px); line-height:.98; }
  .responsible-photo{ aspect-ratio:4/5; overflow:hidden; }
  .responsible-photo img{ filter:grayscale(1) contrast(1.05); }
  .responsible .r-list{ margin-top:44px; }
  .r-list{ display:grid; grid-template-columns:1fr 1fr; gap:30px 34px; }
  .r-item{ border-top:1px solid var(--line); padding-top:16px; }
  .r-item .seal svg{ width:16px; height:16px; color:var(--seal); margin-bottom:10px; }
  .r-item p{ font-size:13.5px; color:var(--grey); }

  /* contact */
  .contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:80px; }
  .contact-grid h2{ font-size:clamp(38px,5.6vw,80px); margin-bottom:32px; }
  .contact-list .row{ display:flex; justify-content:space-between; padding:18px 0; border-bottom:1px solid var(--line); font-size:14px; }
  .contact-list .row span:first-child{ font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--grey); }
  .map-frame{ aspect-ratio:1/1; overflow:hidden; border:1px solid var(--line); }
  .map-frame img{ filter:grayscale(1); }

  footer{ background:var(--black); color:var(--white); padding:64px 48px 30px; }
  .footer-top{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:40px; max-width:1240px; margin:0 auto 50px; }
  .footer-top .logo-lockup .l1,.footer-top .logo-lockup .l2{ color:var(--white); }
  .footer-top .logo-lockup .rule{ background:var(--white); }
  .footer-top .logo-lockup .seal svg{ color:var(--white); }
  .footer-links{ display:flex; gap:60px; flex-wrap:wrap; }
  .footer-col .label{ color:#8A8983; margin-bottom:16px; display:block; }
  .footer-col a{ display:block; font-size:13.5px; color:#B6B5AE; margin-bottom:10px; }
  .footer-col a:hover{ color:var(--white); }
  .footer-bottom{ max-width:1240px; margin:0 auto; display:flex; justify-content:space-between; padding-top:24px; border-top:1px solid #242422; font-size:11px; color:#7A7972; flex-wrap:wrap; gap:12px; }

  @media (max-width:900px){
    header{padding:16px 20px;}
    nav ul{gap:18px;}
    section{padding:80px 20px;}
    .manifesto-grid, .responsible-grid, .contact-grid, .lab-cols{grid-template-columns:1fr; gap:36px;}
    .process-strip{grid-template-columns:1fr 1fr;}
    .nossa-showcase{grid-template-columns:1fr;}
    .nossa-copy{padding:40px 0 0; border-left:none; border-top:1px solid var(--line);}
    .nossa-copy p{max-width:100%;}
    .editorial-grid{grid-template-columns:repeat(2,1fr);}
    .manifesto-side p{margin-left:0;}
  }
/* ===== Page-specific styles: About ===== */
/* page-specific: About */
  .about-page-hero{ height:64vh; min-height:440px; position:relative; display:flex; align-items:flex-end; }
  .about-page-hero .frame{ position:absolute; inset:0; overflow:hidden; }
  .about-page-hero .frame img{ filter:grayscale(1) contrast(1.06) brightness(.9); }
  .about-page-hero .frame::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,10,10,.1) 0%, rgba(10,10,10,.7) 100%); }
  .about-page-hero-inner{ position:relative; z-index:2; padding:0 48px 56px; color:var(--white); }
  .about-page-hero-inner .label{ color:#D8D6CE; margin-bottom:14px; }
  .about-page-hero-inner h1{ font-size:clamp(46px,7.5vw,110px); line-height:.9; }

  .story{ max-width:1180px; margin:0 auto; padding:120px 48px; }
  .story-row{ display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; margin-bottom:110px; }
  .story-row.reverse .story-photo{ order:2; }
  .story-row.reverse .story-copy{ order:1; }
  .story-photo{ aspect-ratio:4/5; overflow:hidden; }
  .story-photo img{ filter:grayscale(1) contrast(1.05); }
  .story-copy p{ font-size:16px; color:var(--thread); line-height:1.7; }
  .story-copy p + p{ margin-top:18px; }
  .story-copy .label{ margin-bottom:20px; }

  .story-final{ text-align:center; max-width:760px; margin:0 auto 90px; }
  .story-final p{ font-size:16px; color:var(--thread); line-height:1.7; }

  .strip{ display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--line); }
  .strip .item{ aspect-ratio:1/1; overflow:hidden; }
  .strip .item img{ filter:grayscale(1); transition:filter .4s ease, transform .5s ease; }
  .strip .item:hover img{ filter:grayscale(0); transform:scale(1.04); }

  @media (max-width:900px){
    .story-row{ grid-template-columns:1fr; gap:32px; margin-bottom:64px; }
    .story-row.reverse .story-photo, .story-row.reverse .story-copy{ order:0; }
    .story{ padding:70px 22px; }
    .strip{ grid-template-columns:1fr 1fr; }
  }
/* ===== Page-specific styles: Lab ===== */
/* page-specific: Lab */
  .page-hero{ height:58vh; min-height:420px; position:relative; display:flex; align-items:flex-end; }
  .page-hero .frame{ position:absolute; inset:0; overflow:hidden; }
  .page-hero .frame img{ filter:grayscale(1) contrast(1.06) brightness(.9); }
  .page-hero .frame::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,10,10,.1) 0%, rgba(10,10,10,.7) 100%); }
  .page-hero-inner{ position:relative; z-index:2; padding:0 48px 56px; color:var(--white); max-width:680px; }
  .page-hero-inner .label{ color:#D8D6CE; margin-bottom:14px; }
  .page-hero-inner h1{ font-size:clamp(46px,7.5vw,100px); line-height:.9; }
  .page-hero-inner p{ margin-top:20px; color:#D8D6CE; font-size:15px; }

  .services-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--line); }
  .service-card{ background:var(--white); padding:44px 36px; }
  .service-card .seal svg{ width:20px; height:20px; color:var(--seal); margin-bottom:20px; }
  .service-card h3{ font-size:22px; margin-bottom:14px; }
  .service-card p{ font-size:14px; color:var(--thread); line-height:1.6; }

  .content-strip{ display:grid; grid-template-columns:repeat(2,1fr); gap:2px; background:var(--line); }
  .content-strip .item{ aspect-ratio:3/2; overflow:hidden; }
  .content-strip .item img{ filter:grayscale(1); }

  .content-strip-head{ max-width:1180px; margin:0 auto; padding:100px 48px 40px; }
  .content-strip-head .label{ margin-bottom:16px; }
  .content-strip-head h2{ font-size:clamp(30px,4vw,52px); }

  @media (max-width:900px){
    .services-grid, .content-strip{ grid-template-columns:1fr 1fr; }
    .content-strip-head{ padding:60px 22px 28px; }
  }
  @media (max-width:600px){
    .services-grid, .content-strip{ grid-template-columns:1fr; }
  }
/* ===== Page-specific styles: Contact ===== */
/* page-specific: Contact */
  .contact-page{ padding:170px 48px 120px; max-width:1180px; margin:0 auto; }
  .contact-page-grid{ display:grid; grid-template-columns:1fr 1fr; gap:80px; }
  .contact-page h1{ font-size:clamp(46px,7vw,96px); line-height:.9; margin-bottom:26px; }
  .contact-page .label{ margin-bottom:20px; }

  .team-list{ margin-top:48px; }
  .team-row{ display:flex; justify-content:space-between; align-items:baseline; padding:20px 0; border-bottom:1px solid var(--line); }
  .team-row .role{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--thread); }
  .team-row .mail{ font-family:'Space Grotesk'; font-size:15px; }
  .team-row .mail:hover{ color:var(--seal); }

  .contact-info-list .row{ display:flex; justify-content:space-between; padding:18px 0; border-bottom:1px solid var(--line); font-size:14.5px; }
  .contact-info-list .row span:first-child{ font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--thread); }

  .map-frame{ aspect-ratio:1/1; overflow:hidden; border:1px solid var(--line); margin-top:36px; }
  .map-frame img{ filter:grayscale(1); }

  .social-row{ display:flex; gap:24px; margin-top:36px; }
  .social-row a{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; border-bottom:1px solid var(--black); padding-bottom:2px; }

  @media (max-width:900px){
    .contact-page{ padding:130px 22px 70px; }
    .contact-page-grid{ grid-template-columns:1fr; gap:48px; }
  }
/* ===== Page-specific styles: Shop ===== */
/* page-specific: Shop (hidden draft) */
  .devnotice{
    background:var(--seal); color:var(--white); text-align:center;
    padding:12px 20px; font-family:'Space Grotesk'; font-size:12.5px; letter-spacing:.02em; font-weight:500;
  }
  .devnotice b{ text-decoration:underline; }

  .shop-hero{ padding:130px 48px 80px; text-align:center; max-width:760px; margin:0 auto; }
  .shop-hero .label{ display:flex; justify-content:center; margin-bottom:20px; }
  .shop-hero h1{ font-size:clamp(40px,6.5vw,90px); line-height:.94; }
  .shop-hero p{ margin-top:22px; color:var(--grey); font-size:15px; max-width:480px; margin-left:auto; margin-right:auto; }

  .notify{ margin-top:36px; display:flex; max-width:400px; margin-left:auto; margin-right:auto; border:1px solid var(--black); }
  .notify input{ flex:1; border:none; background:transparent; padding:15px 18px; font-family:'Space Grotesk'; font-size:13.5px; color:var(--black); }
  .notify input:focus{ outline:none; }
  .notify button{
    background:var(--black); color:var(--white); border:none; padding:0 24px;
    font-family:'Space Grotesk'; font-weight:600; font-size:11px; letter-spacing:.14em; text-transform:uppercase; cursor:pointer;
  }

  .cat-strip{ display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--line); }
  .cat{ position:relative; aspect-ratio:3/4; overflow:hidden; }
  .cat img{ filter:grayscale(1); }
  .cat::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,10,10,.1) 30%, rgba(10,10,10,.75) 100%); }
  .cat .label-tag{ position:absolute; left:20px; bottom:20px; z-index:2; color:var(--white); }
  .cat .label-tag .label{ color:#D8D6CE; margin-bottom:6px; }
  .cat .label-tag h3{ font-size:24px; }
  .cat .soon{
    position:absolute; top:16px; right:16px; z-index:2; background:var(--white); color:var(--black);
    font-family:'Space Grotesk'; font-weight:600; font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; padding:6px 12px;
  }

  .product-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:var(--line); }
  .product{ background:var(--white); }
  .product .frame{ position:relative; aspect-ratio:3/4; overflow:hidden; }
  .product .frame img{ filter:grayscale(1); }
  .product .frame .veil{
    position:absolute; inset:0; background:rgba(255,255,255,.5); backdrop-filter:blur(1.5px);
    display:flex; align-items:center; justify-content:center;
  }
  .product .veil span{
    font-family:'Space Grotesk'; font-weight:600; font-size:10px; letter-spacing:.14em; text-transform:uppercase;
    background:var(--black); color:var(--white); padding:9px 15px;
  }
  .product .meta{ padding:16px 4px; }
  .product .meta .name{ font-family:'Bebas Neue'; font-size:19px; }
  .product .meta .price{ font-size:12.5px; color:var(--grey); margin-top:4px; }

  .legal-note{ background:var(--off); border:1px solid var(--line); padding:44px; max-width:800px; margin:0 auto; }
  .legal-note h3{ font-size:22px; margin-bottom:20px; }
  .legal-note ul{ list-style:none; }
  .legal-note li{ position:relative; padding-left:22px; font-size:14px; color:var(--grey); margin-bottom:12px; line-height:1.5; }
  .legal-note li::before{ content:"—"; position:absolute; left:0; color:var(--seal); }

  .shop-footer{ text-align:center; padding:44px 20px; color:var(--grey); font-size:11.5px; border-top:1px solid var(--line); }

  @media (max-width:900px){
    .cat-strip{ grid-template-columns:1fr; }
    .product-grid{ grid-template-columns:1fr 1fr; }
    .shop-hero{ padding:100px 22px 60px; }
  }
/* ===== Page-specific styles: Account ===== */
/* page-specific: Account (visual mockup only — not wired to a real backend) */
  .mockup-flag{
    background:var(--off); border-bottom:1px solid var(--line); text-align:center;
    padding:11px 20px; font-family:'Space Grotesk'; font-size:12px; color:var(--grey);
  }

  .account-page{ padding:150px 48px 120px; max-width:1000px; margin:0 auto; }

  .auth-tabs{ display:flex; gap:0; border-bottom:1px solid var(--line); margin-bottom:48px; }
  .auth-tabs button{
    background:none; border:none; cursor:pointer; padding:16px 28px 16px 0; margin-right:28px;
    font-family:'Bebas Neue'; font-size:20px; color:var(--grey); border-bottom:2px solid transparent; margin-bottom:-1px;
  }
  .auth-tabs button.active{ color:var(--black); border-color:var(--seal); }

  .auth-panel{ display:none; }
  .auth-panel.active{ display:block; }

  .auth-form{ max-width:420px; }
  .field{ margin-bottom:20px; }
  .field label{ display:block; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--grey); margin-bottom:8px; }
  .field input{
    width:100%; border:1px solid var(--line); background:var(--white); padding:14px 16px;
    font-family:'Space Grotesk'; font-size:14px; color:var(--black);
  }
  .field input:focus{ outline:none; border-color:var(--black); }
  .auth-form .btn{ width:100%; justify-content:center; margin-top:8px; }
  .auth-note{ font-size:12.5px; color:var(--grey); margin-top:18px; }

  .dash-head{ display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:44px; flex-wrap:wrap; gap:20px; }
  .dash-head h1{ font-size:clamp(34px,4.5vw,54px); }
  .dash-tabs{ display:flex; gap:28px; }
  .dash-tabs a{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--grey); padding-bottom:8px; border-bottom:2px solid transparent; }
  .dash-tabs a.active{ color:var(--black); border-color:var(--seal); }

  .order-table{ width:100%; border-collapse:collapse; }
  .order-table th{ text-align:left; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--grey); font-weight:500; padding:14px 0; border-bottom:1px solid var(--line); }
  .order-table td{ padding:18px 0; border-bottom:1px solid var(--line); font-family:'Space Grotesk'; font-size:14px; }
  .order-table .status{ font-size:11px; letter-spacing:.08em; text-transform:uppercase; padding:5px 10px; background:var(--off); display:inline-block; }
  .order-table .status.shipped{ color:#3B6B4A; }

  .empty-state{ text-align:center; padding:80px 20px; border:1px dashed var(--line); }
  .empty-state p{ color:var(--grey); font-size:14px; margin-top:10px; }

  .profile-grid{ display:grid; grid-template-columns:1fr 1fr; gap:28px; max-width:600px; }

  @media (max-width:700px){
    .account-page{ padding:120px 22px 70px; }
    .profile-grid{ grid-template-columns:1fr; }
  }
/* --- Shop page: griglia prodotti WooCommerce --- */
.woocommerce ul.products{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:32px;
  list-style:none;
  margin:0;
  padding:60px 40px;
}
.woocommerce ul.products li.product{
  margin:0;
  text-align:left;
}
.woocommerce ul.products li.product a{
  display:block;
  text-decoration:none;
  color:inherit;
}
.woocommerce ul.products li.product a img{
  aspect-ratio:4/5;
  width:100%;
  object-fit:cover;
  display:block;
  margin-bottom:18px;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:'Bebas Neue';
  font-size:19px;
  letter-spacing:.02em;
  margin:0 0 6px;
}
.woocommerce ul.products li.product .price{
  font-family:'Space Grotesk';
  font-size:14px;
  color:var(--grey);
}
.woocommerce ul.products li.product .button{
  display:inline-block;
  margin-top:14px;
  padding:11px 20px;
  font-family:'Space Grotesk';
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  background:var(--black);
  color:var(--white);
  border:none;
}
.woocommerce ul.products li.product .button:hover{
  background:var(--seal);
}

@media (max-width:900px){
  .woocommerce ul.products{
    grid-template-columns:1fr 1fr;
    gap:20px;
    padding:40px 20px;
  }
}
/* --- Override forzato griglia WooCommerce --- */
.woocommerce ul.products{
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;
  gap:32px !important;
  list-style:none !important;
  padding:60px 40px !important;
  margin:0 !important;
}
.woocommerce ul.products li.product{
  width:auto !important;
  float:none !important;
  margin:0 !important;
  clear:none !important;
}
.woocommerce ul.products li.product a{
  display:block !important;
  text-decoration:none !important;
}
.woocommerce ul.products li.product img{
  width:100% !important;
  height:auto !important;
  aspect-ratio:4/5 !important;
  object-fit:cover !important;
  display:block !important;
  margin-bottom:18px !important;
}
@media (max-width:900px){
  .woocommerce ul.products{
    grid-template-columns:1fr 1fr !important;
    gap:20px !important;
    padding:40px 20px !important;
  }
}
/* --- Rimuove pseudo-elementi clearfix di WooCommerce che rompono la griglia --- */
.woocommerce ul.products::before,
.woocommerce ul.products::after{
  display:none !important;
  content:none !important;
}
/* --- Shop: contenitore a piena larghezza --- */
body.woocommerce-shop div:has(> .woocommerce.columns-4){
  max-width:1300px !important;
  padding-left:48px !important;
  padding-right:48px !important;
}
.woocommerce ul.products{
  grid-template-columns:repeat(3,1fr) !important;
  gap:40px !important;
  padding:60px 0 !important;
}
@media (max-width:1200px){
  body.woocommerce-shop div:has(> .woocommerce.columns-4){
    max-width:100% !important;
  }
}