/* RETROMAT V30.0 - COMPANY PRESENTATION POLISH */
@font-face{font-family:CategoriesElegant;src:url('assets/fonts/categories-elegant-regular.otf') format('opentype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:CategoriesElegant;src:url('assets/fonts/categories-elegant-italic.otf') format('opentype');font-style:italic;font-weight:400;font-display:swap}

:root{--bg:#fff;--ink:#101010;--muted:#666;--line:#e8e8e6;--serif:Georgia,'Times New Roman',serif;--sans:Inter,Arial,Helvetica,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:#fff}
body{margin:0;background:#fff;color:var(--ink);font-family:var(--sans);font-size:clamp(16px,.90vw,30px);line-height:1.58;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{display:block;max-width:100%}img{height:auto}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}figure{margin:0;background:transparent;overflow:visible}

/* Header */
.site-header{position:fixed;inset:0 0 auto 0;height:72px;z-index:50;display:flex;align-items:center;justify-content:flex-end;padding:0 4vw;transition:background .25s,color .25s,border-color .25s;color:#fff}
.site-header.scrolled{background:rgba(255,255,255,.97);backdrop-filter:blur(12px);color:#111;border-bottom:1px solid var(--line)}
.desktop-nav{display:flex;align-items:center;gap:2vw;font-size:clamp(10px,.58vw,18px);font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.desktop-nav a{position:relative;padding:8px 0}.desktop-nav a:after{content:'';position:absolute;left:0;right:100%;bottom:3px;height:1px;background:currentColor;transition:right .2s}.desktop-nav a:hover:after{right:0}
.menu-button{display:none;border:0;background:transparent;width:42px;height:42px;position:relative;color:inherit}.menu-button span{position:absolute;left:8px;right:8px;height:1px;background:currentColor;transition:.2s}.menu-button span:first-child{top:17px}.menu-button span:last-child{top:25px}.menu-button[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}.menu-button[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)}.mobile-menu{display:none}

/* Hero */
.hero{position:relative;min-height:100svh;height:100vh;background:#111;overflow:hidden}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 52%}
.hero-shade{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.08),rgba(0,0,0,.02) 45%,rgba(0,0,0,.16))}
.hero-content{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;padding:80px 20px 40px;overflow:hidden}
.brand-wordmark{font-family:CategoriesElegant,var(--serif);font-weight:400;font-size:clamp(78px,9.5vw,320px);line-height:.88;letter-spacing:-.025em;margin:0;white-space:nowrap}
.hero-tagline{font-family:var(--serif);font-style:italic;font-size:clamp(17px,1.25vw,38px);line-height:1.2;margin:16px 0 26px;text-shadow:0 1px 16px rgba(0,0,0,.25)}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 22px;border:1px solid transparent;font-size:clamp(10px,.58vw,18px);font-weight:700;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s,border-color .2s}.button-dark,.button-light{background:#111;color:#fff}.button-dark:hover,.button-light:hover{background:#333}

/* Global scale: viewport based so browser zoom does not make the site tiny */
.section{width:min(86vw,2600px);margin:0 auto;padding:clamp(88px,6vw,180px) 0;border-bottom:1px solid var(--line);scroll-margin-top:88px}
.eyebrow{font-size:clamp(10px,.52vw,17px);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0 0 17px}
h2,h3{font-family:var(--serif);font-weight:400;letter-spacing:-.035em;margin:0;color:#111}
h2{font-size:clamp(54px,3.9vw,130px);line-height:.97}
h3{font-size:clamp(42px,3vw,100px);line-height:1}
p{margin:0 0 16px}.lead,.booth-lead{font-size:clamp(18px,1.05vw,34px);line-height:1.42;color:#191919}.text-link{display:inline-block;margin-top:14px;border-bottom:1px solid #111;padding-bottom:3px;font-size:clamp(11px,.62vw,20px);font-weight:700;letter-spacing:.04em}

/* Intro */
.intro{display:grid;grid-template-columns:minmax(0,30vw) minmax(0,32vw);justify-content:space-between;gap:7vw;align-items:center;min-height:min(49vw,1050px)}
.intro-copy{width:30vw;max-width:920px}
.intro-copy h2{margin-bottom:1.6vw}
.intro-copy p:not(.eyebrow){max-width:28vw}
.intro-photo{justify-self:end;width:min(32vw,960px)}
.intro-photo img{width:100%;height:auto;object-fit:contain}

/* Booths */
.section-head{margin-bottom:clamp(58px,4.5vw,135px);max-width:58vw}.section-head h2{margin-bottom:12px}.section-head>p:last-child{color:var(--muted)}
.booth-list{display:flex;flex-direction:column;gap:clamp(90px,8vw,240px)}
.booth{display:grid;grid-template-columns:minmax(0,27vw) minmax(0,35vw);justify-content:space-between;grid-template-areas:"copy main" "copy rail";column-gap:7vw;row-gap:16px;align-items:start}
.booth-copy{grid-area:copy;width:27vw;max-width:820px;padding-top:6px}.booth-index{font-size:clamp(10px,.55vw,18px);color:var(--muted);margin:0 0 13px}.booth-copy h3{margin-bottom:16px}.booth-copy p{max-width:26vw}
.booth-main{grid-area:main;width:min(35vw,1040px);justify-self:end;display:block}
.booth-main img{width:100%;height:auto;max-width:100%;max-height:none;object-fit:contain;object-position:center top}
.photo-rail{grid-area:rail;width:min(35vw,1040px);justify-self:end;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:clamp(10px,.65vw,18px);overflow:visible}
.photo-rail figure{height:min(10.5vw,245px);min-width:0;display:flex;align-items:flex-end;justify-content:center}
.photo-rail figure:first-child{justify-content:flex-start}
.photo-rail figure:last-child{justify-content:flex-end}
.photo-rail img{width:auto;height:100%;max-width:100%;max-height:min(10.5vw,245px);object-fit:contain;object-position:center bottom}

/* Made in Portugal */
.made{display:grid;grid-template-columns:minmax(0,28vw) minmax(0,43vw);justify-content:space-between;gap:6vw;align-items:start}.made-copy{width:28vw;max-width:850px}.made-copy h2{font-size:clamp(50px,3.7vw,120px);margin-bottom:22px}.made-copy p{max-width:27vw}
.build-grid{width:43vw;max-width:1300px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7vw;align-items:start}.build-grid figure{display:flex;align-items:flex-start;justify-content:center}.build-grid img{width:100%;height:auto;object-fit:contain}.build-wide{grid-column:span 2}

/* Find us */
.find{display:grid;grid-template-columns:minmax(0,28vw) minmax(0,43vw);justify-content:space-between;gap:6vw;align-items:start}.find-copy{width:28vw;max-width:850px}.find-copy h2{font-size:clamp(52px,3.8vw,122px);margin-bottom:22px}
.find-grid{width:43vw;max-width:1300px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7vw;align-items:start}.find-grid figure{display:flex;align-items:flex-start;justify-content:center}.find-grid img{width:100%;height:auto;object-fit:contain}

/* Event / Venue / Story */
.event,.venue,.story{display:grid;grid-template-columns:minmax(0,30vw) minmax(0,34vw);justify-content:space-between;gap:7vw;align-items:center}
.event-copy,.venue-copy,.story-copy{width:30vw;max-width:910px}.event-copy h2,.venue-copy h2,.story-copy h2{font-size:clamp(52px,3.85vw,124px);margin-bottom:24px}
.event-photo,.venue-photo{justify-self:end;width:min(34vw,1020px)}.event-photo img,.venue-photo img{width:100%;height:auto;object-fit:contain}
.story{border-bottom:0}.story-photo{justify-self:end;width:min(36vw,1100px);align-self:center}.story-photo img{width:100%;height:auto;object-fit:contain}.story .story-photo{grid-column:2;grid-row:1;margin:0}

/* Contact/footer */
.contact{background:#fff;color:#111;padding:clamp(90px,6vw,180px) 7vw;border-top:0}.contact-inner{width:min(86vw,2600px);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:7vw}.contact h2{color:#111;font-size:clamp(52px,3.85vw,124px)}.contact .eyebrow{color:#777}.contact-copy{max-width:34vw}.contact-form{display:grid;gap:24px;align-content:start}.contact-form label{display:grid;gap:8px;font-size:clamp(10px,.58vw,18px);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#666}.contact-form input,.contact-form textarea{width:100%;background:transparent;border:0;border-bottom:1px solid #bdbdb8;color:#111;padding:12px 0;outline:none;border-radius:0;text-transform:none;letter-spacing:0;font-weight:400;font-size:clamp(16px,.9vw,28px)}.contact-form textarea{resize:vertical}.contact-form input:focus,.contact-form textarea:focus{border-color:#111}.contact-form .button{justify-self:start;margin-top:10px}
.footer{width:min(86vw,2600px);margin:0 auto;padding:52px 0 30px;background:#fff;color:#111}.footer-tagline{font-family:var(--serif);font-style:italic;font-size:clamp(18px,1vw,30px)}.footer nav{display:flex;justify-content:flex-end;gap:28px;margin-top:-34px;font-size:clamp(10px,.58vw,18px);font-weight:700;letter-spacing:.08em;text-transform:uppercase}.footer-bottom{border-top:1px solid var(--line);margin-top:38px;padding-top:20px;display:flex;justify-content:space-between;color:#777;font-size:clamp(10px,.58vw,18px)}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}.reveal.visible{opacity:1;transform:none}

/* Tablet: switch to one column before the desktop proportions become cramped */
@media(max-width:1100px){
  body{font-size:16px}.desktop-nav{display:none}.menu-button{display:block}.site-header{height:64px}.mobile-menu{display:block;position:fixed;inset:0;z-index:40;background:#fff;color:#111;transform:translateY(-100%);transition:transform .32s ease;padding:110px 28px 40px}.mobile-menu.open{transform:none}.mobile-menu nav{display:grid;gap:14px}.mobile-menu a{font-family:var(--serif);font-size:clamp(36px,8vw,60px);line-height:1.02}
  .section{width:calc(100% - 56px);padding:86px 0}.intro,.made,.find,.event,.venue,.story,.booth{grid-template-columns:1fr;gap:36px;min-height:0}.booth{grid-template-areas:"copy" "main" "rail"}.intro-copy,.booth-copy,.made-copy,.find-copy,.event-copy,.venue-copy,.story-copy{width:auto;max-width:760px}.intro-copy p:not(.eyebrow),.booth-copy p,.made-copy p{max-width:720px}.intro-photo,.booth-main,.photo-rail,.event-photo,.venue-photo,.story-photo,.build-grid,.find-grid{width:min(100%,820px);max-width:100%;justify-self:start}.booth-main img{max-height:none}.photo-rail{display:flex;justify-content:flex-start;gap:12px;overflow:hidden}.photo-rail figure{height:200px;flex:0 0 auto}.photo-rail img{height:100%;width:auto;max-width:none;max-height:200px}.story .story-photo{grid-column:1;grid-row:auto}.build-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.find-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-inner{width:100%;grid-template-columns:1fr}.contact-copy{max-width:760px}.footer nav{margin-top:22px;justify-content:flex-start}
}

/* Mobile */
@media(max-width:680px){
  body{font-size:15px;line-height:1.55}.site-header{padding:0 14px}.hero{height:100svh;min-height:100svh}.hero-content{padding:78px 16px 28px}.brand-wordmark{font-size:11vw;line-height:.92;letter-spacing:-.035em;max-width:94vw}.hero-tagline{font-size:15px;margin:11px 0 18px}.section{width:calc(100% - 32px);padding:70px 0;scroll-margin-top:72px}.eyebrow{font-size:10px;margin-bottom:13px}h2{font-size:12vw;line-height:1}.intro{gap:28px}.intro-copy h2{margin-bottom:20px}.section-head{max-width:none;margin-bottom:48px}.booth-list{gap:76px}.booth{gap:22px}.booth-copy h3{font-size:11.4vw;margin-bottom:14px}.booth-main img{width:100%;max-height:none}.photo-rail{display:flex;justify-content:flex-start;gap:8px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;padding-bottom:4px}.photo-rail figure{height:130px;flex:0 0 auto;scroll-snap-align:start}.photo-rail img{height:100%;width:auto;max-width:none;max-height:130px}.made-copy h2,.find-copy h2,.event-copy h2,.venue-copy h2,.story-copy h2{font-size:11.8vw}.build-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.build-wide{grid-column:span 2}.find-grid{grid-template-columns:1fr 1fr;gap:8px}.contact{padding:70px 16px}.contact h2{font-size:11.8vw}.footer{width:calc(100% - 32px);padding:44px 0 24px}.footer nav{display:grid;gap:12px}.footer-bottom{gap:18px;flex-direction:column}
}
@media(max-width:420px){.brand-wordmark{font-size:10.7vw}.photo-rail{display:flex;gap:8px;overflow-x:auto}.photo-rail figure{height:150px;flex:0 0 auto}.photo-rail img{height:100%;width:auto;max-height:150px}.build-grid,.find-grid{grid-template-columns:1fr}.build-wide{grid-column:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}}

/* V17 render cost control: browser may skip off-screen section painting. */
.booths,.made,.find,.event,.venue,.story,.contact{content-visibility:auto;contain-intrinsic-size:auto 900px}


/* ==========================================================
   RETROMAT V18 - EXACT GALLERY ALIGNMENT + NATIVE LIGHTBOX
   ========================================================== */
.gallery-image{
  cursor:zoom-in;
  -webkit-tap-highlight-color:transparent;
}
.gallery-image:focus-visible{
  outline:2px solid #111;
  outline-offset:4px;
}

/* Keep the detail strip locked to the exact main-photo width. */
.booth-main,
.photo-rail{
  box-sizing:border-box;
}

/* Lightweight native lightbox */
.lightbox{
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  grid-template-columns:72px minmax(0,1fr) 72px;
  align-items:center;
  background:rgba(8,8,8,.94);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .18s ease,visibility .18s ease;
}
.lightbox.open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.lightbox-media{
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:26px 10px;
}
.lightbox-image{
  display:block;
  width:auto;
  height:auto;
  max-width:calc(100vw - 190px);
  max-height:calc(100svh - 100px);
  object-fit:contain;
  background:transparent;
  box-shadow:0 18px 60px rgba(0,0,0,.28);
}
.lightbox-caption{
  max-width:min(760px,75vw);
  margin:0;
  color:rgba(255,255,255,.86);
  font-size:13px;
  line-height:1.45;
  text-align:center;
}
.lightbox-button{
  appearance:none;
  border:0;
  background:rgba(255,255,255,.08);
  color:#fff;
  width:48px;
  height:48px;
  border-radius:50%;
  display:grid;
  place-items:center;
  cursor:pointer;
  line-height:1;
  font-size:28px;
  transition:background .16s ease,transform .16s ease;
}
.lightbox-button:hover{background:rgba(255,255,255,.16)}
.lightbox-button:active{transform:scale(.96)}
.lightbox-prev{justify-self:center}
.lightbox-next{justify-self:center}
.lightbox-close{
  position:absolute;
  top:18px;
  right:18px;
  font-size:24px;
  z-index:2;
}
body.lightbox-open{overflow:hidden}

@media(max-width:1100px){
  .booth-main,
  .photo-rail{
    width:min(100%,820px);
    justify-self:start;
  }
  .booth-main img{width:100%;height:auto}
  .photo-rail{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
  }
  .photo-rail figure{
    height:clamp(140px,22vw,230px);
  }
  .photo-rail img{
    height:100%;
    width:auto;
    max-width:100%;
    max-height:100%;
  }
}

@media(max-width:680px){
  .photo-rail{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    overflow:visible;
  }
  .photo-rail figure{
    height:28vw;
    display:flex;
    align-items:flex-end;
  }
  .photo-rail figure:first-child{justify-content:flex-start}
  .photo-rail figure:nth-child(2){justify-content:center}
  .photo-rail figure:last-child{justify-content:flex-end}
  .photo-rail img{
    width:auto;
    height:100%;
    max-width:100%;
    max-height:100%;
    object-fit:contain;
  }

  .lightbox{
    grid-template-columns:50px minmax(0,1fr) 50px;
  }
  .lightbox-image{
    max-width:calc(100vw - 112px);
    max-height:calc(100svh - 110px);
  }
  .lightbox-button{width:42px;height:42px;font-size:24px}
  .lightbox-close{top:12px;right:12px}
  .lightbox-caption{max-width:78vw;font-size:12px}
}

@media(max-width:420px){
  .photo-rail{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .photo-rail figure,
  .photo-rail figure:last-child{
    grid-column:auto;
    height:27vw;
  }
}


/* ==========================================================
   RETROMAT V19 - COMPACT LEVEL GALLERY OVERRIDES
   ========================================================== */
.gallery-image:focus{outline:none}

/* Desktop: keep the strip compact and aligned to the left edge of the main image. */
@media(min-width:1101px){
  .photo-rail{
    display:flex;
    flex-wrap:nowrap;
    align-items:flex-end;
    justify-self:start;
    width:fit-content;
    max-width:min(35vw,1040px);
    gap:clamp(12px,.75vw,18px);
    overflow:visible;
  }
  .photo-rail figure{
    flex:0 0 auto;
    height:clamp(150px,9.6vw,210px);
    display:flex;
    align-items:flex-end;
    justify-content:flex-start;
    min-width:0;
  }
  .photo-rail img{
    width:auto;
    height:100%;
    max-width:100%;
    max-height:100%;
    object-fit:contain;
    object-position:center bottom;
  }
}

/* Tablet: same alignment, scroll only if needed. */
@media(max-width:1100px){
  .photo-rail{
    display:flex;
    flex-wrap:nowrap;
    align-items:flex-end;
    justify-content:flex-start;
    justify-self:start;
    width:fit-content;
    max-width:100%;
    gap:10px;
    overflow-x:auto;
    overflow-y:hidden;
    padding-bottom:2px;
  }
  .photo-rail figure{
    flex:0 0 auto;
    height:clamp(150px,22vw,210px);
    display:flex;
    align-items:flex-end;
    justify-content:flex-start;
  }
  .photo-rail img{
    width:auto;
    height:100%;
    max-width:100%;
    max-height:100%;
    object-fit:contain;
  }
}

/* Mobile: preserve the compact strip. */
@media(max-width:680px){
  .photo-rail{gap:8px;padding-bottom:4px}
  .photo-rail figure{height:130px}
}

@media(max-width:420px){
  .photo-rail figure{height:124px}
}


/* ==========================================================
   RETROMAT V20 - REDUCE MAIN PHOTO SIZE ON DESKTOP
   ========================================================== */
@media(min-width:1101px){
  .booth{
    grid-template-columns:minmax(0,27vw) minmax(0,29vw);
    column-gap:5.5vw;
  }
  .booth-main{
    width:min(29vw,860px);
    justify-self:start;
  }
  .booth-main img{
    width:100%;
    max-width:100%;
    height:auto;
    object-fit:contain;
  }
  .photo-rail{
    max-width:min(29vw,860px);
  }
}


/* ==========================================================
   RETROMAT V21 - STABLE NO-CROP GALLERIES
   Fixes Find Us + Made in Portugal at every desktop zoom level.
   ========================================================== */

/* Desktop: equal-width editorial columns, natural image ratio, zero crop. */
@media(min-width:1101px){
  .made{
    grid-template-columns:minmax(0,27vw) minmax(0,41vw);
    gap:5vw;
  }
  .build-grid{
    display:block !important;
    width:min(41vw,1180px) !important;
    max-width:100% !important;
    columns:3;
    column-gap:clamp(12px,.75vw,18px);
    align-self:start;
  }
  .build-grid figure,
  .build-grid .build-tall,
  .build-grid .build-wide{
    display:block !important;
    width:100% !important;
    height:auto !important;
    margin:0 0 clamp(12px,.75vw,18px) !important;
    grid-column:auto !important;
    grid-row:auto !important;
    break-inside:avoid;
    -webkit-column-break-inside:avoid;
  }
  .build-grid img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    max-width:100% !important;
    object-fit:contain !important;
  }

  .find{
    grid-template-columns:minmax(0,27vw) minmax(0,40vw);
    gap:5vw;
  }
  .find-grid{
    display:block !important;
    width:min(40vw,1120px) !important;
    max-width:100% !important;
    columns:2;
    column-gap:clamp(12px,.8vw,20px);
    align-self:start;
  }
  .find-grid figure,
  .find-grid .find-main{
    display:block !important;
    width:100% !important;
    height:auto !important;
    margin:0 0 clamp(12px,.8vw,20px) !important;
    grid-column:auto !important;
    grid-row:auto !important;
    break-inside:avoid;
    -webkit-column-break-inside:avoid;
  }
  .find-grid img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    max-width:100% !important;
    object-fit:contain !important;
  }
}

/* Tablet: two clean masonry columns, never forced/cropped. */
@media(max-width:1100px){
  .build-grid,
  .find-grid{
    display:block !important;
    width:min(100%,820px) !important;
    max-width:100% !important;
    columns:2;
    column-gap:12px;
  }
  .build-grid figure,
  .build-grid .build-tall,
  .build-grid .build-wide,
  .find-grid figure,
  .find-grid .find-main{
    display:block !important;
    width:100% !important;
    height:auto !important;
    margin:0 0 12px !important;
    grid-column:auto !important;
    grid-row:auto !important;
    break-inside:avoid;
    -webkit-column-break-inside:avoid;
  }
  .build-grid img,
  .find-grid img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    max-width:100% !important;
    object-fit:contain !important;
  }
}

/* Phone: keep two useful columns; very small phones become one column. */
@media(max-width:680px){
  .build-grid,
  .find-grid{
    columns:2 !important;
    column-gap:8px !important;
  }
  .build-grid figure,
  .build-grid .build-tall,
  .build-grid .build-wide,
  .find-grid figure,
  .find-grid .find-main{
    margin-bottom:8px !important;
  }
}

@media(max-width:420px){
  .build-grid,
  .find-grid{
    columns:1 !important;
  }
}


/* ==========================================================
   RETROMAT V22 - BALANCED DESKTOP MEDIA SCALE
   Tuned from the supplied full-page video: every desktop image
   area is reduced consistently. No crop; tablet/mobile unchanged.
   ========================================================== */
@media(min-width:1101px){
  .intro{
    grid-template-columns:minmax(0,28vw) minmax(0,22vw);
    justify-content:center;
    gap:5.5vw;
    min-height:min(39vw,820px);
  }
  .intro-copy{width:28vw;max-width:840px}
  .intro-copy p:not(.eyebrow){max-width:27vw}
  .intro-photo{
    width:min(22vw,650px);
    justify-self:start;
  }

  .booth{
    grid-template-columns:minmax(0,25vw) minmax(0,23vw);
    justify-content:center;
    column-gap:5.5vw;
  }
  .booth-copy{width:25vw;max-width:720px}
  .booth-copy p{max-width:24vw}
  .booth-main{
    width:min(23vw,680px);
    justify-self:start;
  }
  .photo-rail{
    max-width:min(23vw,680px);
  }

  .made{
    grid-template-columns:minmax(0,27vw) minmax(0,28vw);
    justify-content:center;
    gap:5vw;
  }
  .made-copy{width:27vw;max-width:780px}
  .made-copy p{max-width:26vw}
  .build-grid{
    width:min(28vw,820px) !important;
    max-width:100% !important;
  }

  .find{
    grid-template-columns:minmax(0,27vw) minmax(0,27vw);
    justify-content:center;
    gap:5vw;
  }
  .find-copy{width:27vw;max-width:780px}
  .find-grid{
    width:min(27vw,790px) !important;
    max-width:100% !important;
  }

  .event,.venue,.story{
    grid-template-columns:minmax(0,28vw) minmax(0,22vw);
    justify-content:center;
    gap:5.5vw;
  }
  .event-copy,.venue-copy,.story-copy{
    width:28vw;
    max-width:820px;
  }
  .event-photo,.venue-photo{
    width:min(22vw,650px);
    justify-self:start;
  }
  .story-photo{
    width:min(24vw,700px);
    justify-self:start;
  }
}


/* ==========================================================
   RETROMAT V23 - PERFORMANCE ONLY
   Layout dimensions from V22 are intentionally preserved.
   ========================================================== */
/* Avoid expensive full-screen backdrop repaints while scrolling. */
.site-header.scrolled{
  background:rgba(255,255,255,.985) !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}

/* Remove scroll-entry transforms/layers. Content stays immediately visible. */
.reveal,
.reveal.visible{
  opacity:1 !important;
  transform:none !important;
  transition:none !important;
}

/* Complex masonry sections were janking when content-visibility activated
   during scroll. Images remain native lazy-loaded, so network loading stays lazy. */
.booths,.made,.find,.event,.venue,.story,.contact{
  content-visibility:visible !important;
  contain:none !important;
  contain-intrinsic-size:auto !important;
}

/* The video is paused by JS whenever the hero is not visible. */
.hero-video{will-change:auto}


/* ==========================================================
   RETROMAT V24 - BOOTH GRID ALIGNMENT ONLY
   Keep V22 image scale + V23 performance.
   ========================================================== */
@media(min-width:1101px){
  /* The section title now starts on the exact same grid line as the booth copy. */
  .booths .section-head{
    width:53.5vw;
    max-width:none;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:clamp(52px,3.8vw,110px);
  }

  /* Match the top edge of the image to the booth index/copy block. */
  .booth-main{
    margin-top:10px;
  }
}


/* ==========================================================
   RETROMAT V26 - HERO CTA REMOVED FROM HTML ON ALL VIEWPORTS
   ========================================================== */
.hero-tagline{margin-bottom:0}


/* ==========================================================
   RETROMAT V27 - NATURAL COPY + FLUID RESPONSIVE TYPOGRAPHY
   The rent section uses content-driven wrapping instead of fixed line breaks.
   ========================================================== */
.event-copy h2{
  font-size:clamp(46px,3.35vw,92px);
  line-height:.99;
  max-width:12ch;
  text-wrap:balance;
}
.event-copy .lead{
  font-size:clamp(18px,1.05vw,26px);
  line-height:1.34;
  max-width:34ch;
  text-wrap:pretty;
}
.event-copy p:not(.eyebrow):not(.lead){
  font-size:clamp(15px,.86vw,19px);
  line-height:1.62;
  max-width:44ch;
  text-wrap:pretty;
}
.event-copy .button{
  min-height:48px;
  padding-inline:clamp(20px,1.35vw,28px);
}

@media(max-width:1100px){
  .event-copy{max-width:680px}
  .event-copy h2{
    font-size:clamp(46px,7vw,72px);
    max-width:12ch;
  }
  .event-copy p:not(.eyebrow):not(.lead){
    max-width:42rem;
  }
}

@media(max-width:680px){
  .event-copy{
    width:100%;
    max-width:none;
  }
  .event-copy h2{
    font-size:clamp(42px,10.6vw,58px);
    line-height:1;
    max-width:11ch;
    margin-bottom:clamp(22px,5vw,30px);
  }
  .event-copy .lead{
    font-size:clamp(20px,5.1vw,24px);
    line-height:1.3;
    margin-bottom:clamp(24px,6vw,32px);
  }
  .event-copy p:not(.eyebrow):not(.lead){
    font-size:clamp(16px,4.15vw,19px);
    line-height:1.55;
    margin-bottom:clamp(19px,4.8vw,25px);
    max-width:100%;
  }
  .event-copy .button{
    min-height:52px;
    padding-inline:24px;
    font-size:clamp(11px,3.1vw,13px);
  }
}


/* ==========================================================
   RETROMAT V28 - MOBILE TYPOGRAPHY SCALE
   Desktop/tablet geometry intentionally unchanged.
   ========================================================== */
@media(max-width:680px){
  body{
    font-size:14px;
    line-height:1.5;
  }

  .section{
    padding:58px 0;
  }

  h2,
  .made-copy h2,
  .find-copy h2,
  .event-copy h2,
  .venue-copy h2,
  .story-copy h2{
    font-size:clamp(36px,9.2vw,46px) !important;
    line-height:1.02 !important;
    letter-spacing:-.035em;
  }

  .booth-copy h3{
    font-size:clamp(34px,8.8vw,44px) !important;
    line-height:1.02;
  }

  .lead,
  .booth-lead,
  .event-copy .lead{
    font-size:clamp(17px,4.4vw,20px) !important;
    line-height:1.35 !important;
  }

  .event-copy p:not(.eyebrow):not(.lead),
  .venue-copy p:not(.eyebrow):not(.lead),
  .story-copy p:not(.eyebrow):not(.lead),
  .made-copy p:not(.eyebrow),
  .find-copy p:not(.eyebrow),
  .booth-copy p:not(.booth-index):not(.booth-lead),
  .intro-copy p:not(.eyebrow):not(.lead){
    font-size:clamp(14px,3.75vw,16px) !important;
    line-height:1.55 !important;
  }

  .eyebrow{
    font-size:9px;
    letter-spacing:.17em;
    margin-bottom:12px;
  }

  .event-copy h2{
    max-width:12ch;
    margin-bottom:20px;
  }
  .event-copy .lead{
    margin-bottom:20px;
  }
  .event-copy p:not(.eyebrow):not(.lead){
    margin-bottom:16px;
  }

  .event-copy .button{
    min-height:46px;
    padding-inline:20px;
    font-size:11px;
  }

  .mobile-menu a{
    font-size:clamp(30px,7.6vw,42px);
  }
}

@media(max-width:420px){
  h2,
  .made-copy h2,
  .find-copy h2,
  .event-copy h2,
  .venue-copy h2,
  .story-copy h2{
    font-size:clamp(34px,9vw,42px) !important;
  }
  .booth-copy h3{
    font-size:clamp(32px,8.5vw,40px) !important;
  }
}


/* ==========================================================
   RETROMAT V29 - FLUID HERO WORDMARK
   Keep the logo impactful without letting it dominate or clip.
   ========================================================== */
.brand-wordmark{
  font-size:clamp(64px,7.3vw,220px);
  line-height:.90;
  letter-spacing:-.022em;
  max-width:86vw;
  white-space:nowrap;
}
.hero-tagline{
  font-size:clamp(15px,1vw,27px);
  margin-top:clamp(10px,.8vw,16px);
}

@media(max-width:1100px){
  .brand-wordmark{
    font-size:clamp(58px,8.4vw,118px);
    max-width:90vw;
  }
  .hero-tagline{font-size:clamp(14px,1.7vw,19px)}
}

@media(max-width:680px){
  .brand-wordmark{
    font-size:9.2vw;
    line-height:.92;
    letter-spacing:-.028em;
    max-width:90vw;
  }
  .hero-tagline{
    font-size:14px;
    line-height:1.2;
    max-width:86vw;
    margin-top:9px;
  }
}

@media(max-width:420px){
  .brand-wordmark{font-size:8.8vw;max-width:88vw}
  .hero-tagline{font-size:13px;max-width:84vw}
}


/* ==========================================================
   RETROMAT V30 - COMPANY PRESENTATION POLISH
   Stable layout, restrained mobile type, tighter section rhythm.
   ========================================================== */

/* Responsive hero poster. The video remains desktop-only via the existing JS. */
.hero{
  background:#111 url('assets/optimized/hero-poster-960-v30.webp') center 52% / cover no-repeat;
}

/* Let headings wrap according to the actual viewport instead of hard HTML breaks. */
.intro-copy h2,
.made-copy h2,
.event-copy h2,
.venue-copy h2,
.story-copy h2,
.contact-copy h2{
  text-wrap:balance;
}

/* The founders source file contains black side bands. Hide only those bands in presentation. */
.story-photo{
  overflow:hidden;
}
.story-photo img{
  width:121.7%;
  max-width:none;
  margin-left:-10.85%;
}

@media(max-width:1100px){
  .story-photo img{
    width:121.7%;
    max-width:none;
    margin-left:-10.85%;
  }
}

@media(max-width:680px){
  .hero{
    background-image:url('assets/optimized/hero-poster-480-v30.webp');
    background-position:center 52%;
  }
  .hero-video{
    display:none !important;
  }

  .site-header{
    height:62px;
    padding-inline:18px;
  }

  .section{
    width:calc(100% - 40px);
    padding:48px 0;
    scroll-margin-top:66px;
  }

  .intro,
  .made,
  .find,
  .event,
  .venue,
  .story,
  .booth{
    gap:26px;
  }

  .section-head{
    margin-bottom:36px;
  }

  h2,
  .made-copy h2,
  .find-copy h2,
  .event-copy h2,
  .venue-copy h2,
  .story-copy h2,
  .contact h2{
    font-size:clamp(32px,8.3vw,40px) !important;
    line-height:1.04 !important;
    letter-spacing:-.032em;
    max-width:13ch;
    margin-bottom:18px;
  }

  .booth-copy h3{
    font-size:clamp(31px,8vw,39px) !important;
    line-height:1.03;
  }

  .lead,
  .booth-lead,
  .event-copy .lead,
  .venue-copy .lead,
  .story-copy .lead{
    font-size:clamp(16px,4.2vw,19px) !important;
    line-height:1.38 !important;
  }

  .intro-copy p:not(.eyebrow):not(.lead),
  .booth-copy p:not(.booth-index):not(.booth-lead),
  .made-copy p:not(.eyebrow):not(.lead),
  .find-copy p:not(.eyebrow):not(.lead),
  .event-copy p:not(.eyebrow):not(.lead),
  .venue-copy p:not(.eyebrow):not(.lead),
  .story-copy p:not(.eyebrow):not(.lead),
  .contact-copy p:not(.eyebrow){
    font-size:15px !important;
    line-height:1.52 !important;
    margin-bottom:15px;
    max-width:38ch;
  }

  .eyebrow{
    font-size:9px;
    letter-spacing:.16em;
    margin-bottom:11px;
  }

  .event-copy .button{
    min-height:44px;
    padding-inline:19px;
    font-size:10px;
  }

  /* Compact the story/contact transition seen on iPhone. */
  .story{
    padding-bottom:26px;
  }
  .story-photo{
    width:100%;
    margin-top:0;
  }
  .contact{
    padding:38px 20px 54px;
  }
  .contact-inner{
    gap:34px;
  }
  .contact-copy{
    max-width:none;
  }
  .contact h2{
    max-width:11.5ch;
  }
  .contact-form{
    gap:18px;
  }
  .contact-form label{
    font-size:9px;
    letter-spacing:.12em;
  }
  .contact-form input,
  .contact-form textarea{
    font-size:16px;
    padding:10px 0;
  }

  /* Keep booth detail images compact and level below the main photo. */
  .photo-rail{
    gap:8px;
  }
  .photo-rail figure{
    height:25vw !important;
    max-height:118px;
  }

  .mobile-menu{
    padding:92px 22px 32px;
  }
  .mobile-menu a{
    font-size:clamp(28px,7vw,36px);
  }
}

@media(max-width:420px){
  h2,
  .made-copy h2,
  .find-copy h2,
  .event-copy h2,
  .venue-copy h2,
  .story-copy h2,
  .contact h2{
    font-size:clamp(31px,8.2vw,38px) !important;
  }

  .section{
    width:calc(100% - 32px);
  }

  .contact{
    padding-inline:16px;
  }
}


/* RETROMAT V37 - STORY CLEANUP */
#venue{
  border-bottom:0 !important;
}
#story{
  border-top:0 !important;
  border-bottom:0 !important;
}
#story .story-photo,
#story .story-photo img{
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
}



/* RETROMAT V40 - MADE TRUE SQUARE */
#made .build-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:clamp(10px,.7vw,16px) !important;
  align-items:start !important;
}

#made .build-grid figure,
#made .build-grid .build-tall,
#made .build-grid .build-wide{
  grid-column:auto !important;
  width:100% !important;
  aspect-ratio:1 / 1 !important;
  overflow:hidden !important;
  display:block !important;
  background:transparent !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  margin:0 !important;
}

#made .build-grid img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}

/* Focal points so the important subject remains visible inside each square. */
#made .build-grid figure:nth-child(1) img{object-position:center 46% !important}
#made .build-grid figure:nth-child(2) img{object-position:center 48% !important}
#made .build-grid figure:nth-child(3) img{object-position:center 50% !important}
#made .build-grid figure:nth-child(4) img{object-position:center 48% !important}
#made .build-grid figure:nth-child(5) img{object-position:center 50% !important}
#made .build-grid figure:nth-child(6) img{object-position:center 46% !important}
#made .build-grid figure:nth-child(7) img{object-position:center 48% !important}

@media(max-width:1100px){
  #made .build-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }
}

@media(max-width:520px){
  #made .build-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }
}
/* END RETROMAT V40 - MADE TRUE SQUARE */

/* V42 MADE GRID START */
/* Made in Portugal - grelha realmente quadrada, sem moldura preta */
@media (min-width: 1101px) {
  .build-grid{
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    gap:clamp(12px, .8vw, 18px) !important;
    width:min(41vw, 1180px) !important;
    max-width:100% !important;
    columns:unset !important;
    column-gap:0 !important;
    align-items:start !important;
  }

  .build-grid figure,
  .build-grid .build-tall,
  .build-grid .build-wide{
    display:block !important;
    width:100% !important;
    aspect-ratio:1 / 1 !important;
    height:auto !important;
    margin:0 !important;
    overflow:hidden !important;
    background:transparent !important;
    grid-column:auto !important;
    grid-row:auto !important;
    break-inside:auto !important;
    -webkit-column-break-inside:auto !important;
  }

  .build-grid img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    object-fit:cover !important;
    object-position:center center !important;
    background:transparent !important;
  }

  .build-grid .build-wide{
    grid-column:auto !important;
  }
}

@media (max-width: 1100px) {
  .build-grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:10px !important;
    width:min(100%, 820px) !important;
    max-width:100% !important;
    columns:unset !important;
    column-gap:0 !important;
  }

  .build-grid figure,
  .build-grid .build-tall,
  .build-grid .build-wide{
    display:block !important;
    width:100% !important;
    aspect-ratio:1 / 1 !important;
    margin:0 !important;
    overflow:hidden !important;
    background:transparent !important;
    grid-column:auto !important;
    grid-row:auto !important;
  }

  .build-grid img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    object-fit:cover !important;
    object-position:center center !important;
    background:transparent !important;
  }
}

@media (max-width: 420px) {
  .build-grid{
    grid-template-columns:1fr !important;
  }
}
/* V42 MADE GRID END */