/*
  NUVA EVENTOS — Editorial Mobile 2.0
  Typography, physical proportions and thoughtful responsive composition.
  Core desktop layout stays in style.css.
*/

/* Clear vector arrows, drawn with CSS; no emoji or platform-specific glyphs */
.hero-heading-mobile{display:none}
.nuva-diagonal, .link-arrow{
  position:relative;display:inline-block;flex:none;
  width:12px;height:12px;
  border-top:1px solid currentColor;border-right:1px solid currentColor;
  font-size:0!important;line-height:0!important;
  transform:none!important;background:transparent!important;
}
.nuva-diagonal::after, .link-arrow::after{
  content:"";position:absolute;right:-1px;top:-1px;
  height:1px;width:16px;background:currentColor;
  transform:rotate(-45deg);transform-origin:right center;
}
.btn .link-arrow,.text-link .link-arrow{margin-left:5px}
.gallery-tile>span{gap:12px;align-items:end}
.gallery-tile .nuva-diagonal{color:inherit;width:11px;height:11px;margin:0 3px 6px 8px}
.gallery-tile{isolation:isolate}
.gallery-tile img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gallery-tile img[hidden],.service-image img[hidden],.about-photo[hidden]{display:none!important}
.service-arrow{font-size:0!important;box-shadow:none!important;background:rgba(247,244,239,.94)!important;color:#171717!important}
.service-arrow .nuva-diagonal{border-width:1px}

/* More tactile, quieter UI on touch devices */
button, a{-webkit-tap-highlight-color:transparent}
:where(a,button,input,select,textarea):focus-visible{outline:2px solid var(--terracotta);outline-offset:4px}
@media(hover:none){
  .service-arrow{opacity:1;transform:none}
  .service-card:hover img,.gallery-tile:hover img{transform:none}
  .btn:hover{transform:none}
}

@media(max-width:800px){
  .mobile-menu{padding:108px 28px 42px}
  .mobile-menu>a{font-size:clamp(45px,11vw,67px);letter-spacing:-.025em;padding:11px 0}
  .mobile-menu-note{margin-top:30px;font-size:9px}
}

/* A completely re-composed mobile first viewport rather than shrinking desktop */
@media(max-width:600px){
  :root{--page:25px}
  body{font-size:13px}
  .container{padding-inline:var(--page)}
  .section-pad{padding-block:78px}

  /* Permanently legible, ivory navigation instead of text across photography */
  .site-header,.site-header.scrolled{
    position:fixed;top:0;left:0;width:100%;height:76px;
    padding:0 25px;gap:16px;background:var(--ivory);
    color:var(--ink);border-bottom:1px solid #e5dcd0;
    transition:height .25s ease,background .25s ease;
  }
  .site-header.menu-active{height:76px;background:var(--ivory)}
  .brand,.scrolled .brand,.menu-active .brand{
    width:83px;height:72px;display:flex;align-items:center;
  }
  .brand img{width:100%;height:100%;object-fit:contain}
  .menu-toggle{margin-left:auto;padding:15px 0 15px 16px;display:block;min-width:45px;min-height:45px}
  .menu-toggle span{width:26px;height:1px;margin:7px 0 7px auto}
  .mobile-menu{top:76px;bottom:0;inset-inline:0;padding:32px 25px max(34px,env(safe-area-inset-bottom));justify-content:flex-start;overflow-y:auto}
  .mobile-menu>a{font-size:clamp(42px,11.3vw,59px);line-height:1.12;padding:15px 0}
  .mobile-menu-note{margin-top:34px;font-size:9px}

  /* Photography has its own space, headings have their own quiet canvas */
  .hero{
    position:relative;display:flex;flex-direction:column;align-items:stretch;
    height:auto;min-height:0;padding-top:76px;background:var(--ivory);
    color:var(--ink);overflow:visible;
  }
  .hero-image{
    position:relative;inset:auto;flex:none;
    height:clamp(255px,40svh,365px);min-height:0;width:100%;
    background-position:54% 48%;background-size:cover;
    animation:none;filter:saturate(.78) contrast(.97);
  }
  .hero-scrim{display:none}
  .hero-content{
    position:relative;z-index:2;flex:none;
    padding:31px 25px 51px;background:var(--ivory);
  }
  .hero-heading-desktop{display:none}
  .hero-heading-mobile{display:block}
  .hero-heading-mobile>span,.hero-heading-mobile>em{display:block;white-space:nowrap}
  .hero h1{
    margin:13px 0 19px;max-width:100%;
    font:400 clamp(43px,11.8vw,58px)/.90 var(--serif);
    letter-spacing:-.045em;color:var(--ink);
  }
  .hero h1 em{font-weight:400}
  .hero-eyebrow,.eyebrow.hero-eyebrow{
    display:flex;align-items:center;gap:13px;margin:0;
    font-size:9px;letter-spacing:.18em;font-weight:700;
    color:var(--terracotta);line-height:1.4;
  }
  .hero-eyebrow .small-line{width:19px;min-width:19px;height:1px;background:#bba28c}
  .hero-intro{
    max-width:340px;margin:0;font-size:12px;line-height:1.85;
    color:#5f5954;font-weight:400;
  }
  .hero-actions{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;gap:22px;margin-top:28px}
  .hero-actions .btn{
    display:inline-flex;width:auto;min-width:0;min-height:47px;
    padding:13px 16px;gap:18px;
    border:1px solid var(--ink);
    background:var(--ink);color:var(--ivory);
    font-size:9px;letter-spacing:.1em;font-weight:700;
    white-space:nowrap;box-shadow:none;border-radius:0;
  }
  .hero-actions .btn .link-arrow{width:10px;height:10px}
  .hero-actions .btn .link-arrow:after{width:13px}
  .hero-actions .text-link{
    display:inline-flex;gap:8px;align-items:center;
    padding:8px 0 9px;min-width:0;
    font-size:9px;letter-spacing:.075em;color:var(--ink);
    border-color:#9f9182;white-space:nowrap;
  }
  .hero-actions .text-link .link-arrow{width:9px;height:9px}
  .hero-actions .text-link .link-arrow:after{width:12px}
  .hero .reveal{transition-delay:0s!important}
  .scroll-cue,.hero-index{display:none}

  /* About: start with words to avoid an endless vertical stack of photos */
  .about{padding-top:73px;padding-bottom:83px}
  .about-layout{display:flex;flex-direction:column;gap:34px}
  .about-copy{order:0;max-width:100%}
  .about-photo-wrap{order:1;width:calc(100% - 21px);margin-left:21px}
  .about-photo{height:auto;min-height:0;aspect-ratio:4/4.4;object-fit:cover}
  .photo-side-caption{font-size:8px;letter-spacing:.16em;left:-28px;bottom:0}
  .display-title{font-size:clamp(43px,11.4vw,59px);letter-spacing:-.04em;line-height:.95}
  .about-copy .display-title{max-width:340px;margin:17px 0 0}
  .about-copy .rule{margin:22px 0}
  .about-copy .lead{font-size:18px;line-height:1.35;margin-bottom:15px}
  .about-copy .body-copy{font-size:12px;line-height:1.9;max-width:330px}
  .about-copy .text-link{margin-top:20px;font-size:10px}

  /* Services: quieter imagery + generous editorial labels */
  .services{padding-top:80px;padding-bottom:84px}
  .section-top{display:block;margin-bottom:35px}
  .section-top .display-title{max-width:345px;margin:17px 0 14px}
  .section-top .display-title br{display:none}
  .section-top>p{margin:0;max-width:315px;font-size:12px;line-height:1.75}
  .service-grid{display:flex;flex-direction:column;gap:40px}
  .service-image{display:block;aspect-ratio:1.15;max-height:380px;min-height:0;overflow:hidden}
  .service-image img{object-fit:cover}
  .service-arrow{right:14px;bottom:14px;width:36px;height:36px;border:none;border-radius:0;opacity:1;transform:none}
  .service-info{display:grid;grid-template-columns:25px 1fr;gap:17px;padding-top:18px}
  .service-info>span{font-size:10px;color:#8f7665}
  .service-info h3{font-size:31px;line-height:1.06;margin-bottom:9px}
  .service-info p{font-size:12px;line-height:1.7;margin:0;max-width:340px}

  /* Manifesto: refined dark band with generous hierarchy */
  .manifesto{padding:79px 0 80px}
  .manifesto-heading{padding:31px 0 45px}
  .manifesto h2{font-size:clamp(40px,10.3vw,52px);line-height:.99;letter-spacing:-.027em}
  .manifesto h2 br{display:none}
  .manifesto .principles{gap:0}
  .principle{padding:21px 0;border-bottom:1px solid rgba(214,195,165,.25)}
  .principle h3{font-size:26px;line-height:1.2}
  .principle p{font-size:12px;line-height:1.7}

  /* Gallery: large photos, never tiny two-up squares */
  .gallery{padding:79px 0 83px}
  .gallery-heading{margin-bottom:26px;text-align:left}
  .gallery-heading .display-title{margin:17px 0 11px;max-width:345px}
  .gallery-heading p{font-size:12px;line-height:1.75;max-width:315px;margin:0}
  .gallery-grid{display:flex;flex-direction:column;gap:13px}
  .gallery-tile,.gallery-tile.tile-a,.gallery-tile.tile-b,.gallery-tile.tile-c,.gallery-tile.tile-d{
    display:block!important;flex:none;width:100%;height:auto!important;
    min-height:0;aspect-ratio:1.17;grid-area:auto!important;
    border-radius:0!important;box-shadow:none!important;
  }
  .gallery-tile.tile-a{aspect-ratio:1.08}
  .gallery-tile.tile-c{aspect-ratio:1.27}
  .gallery-tile::after{inset:42% 0 0;background:linear-gradient(0deg,rgba(10,9,8,.62),transparent)}
  .gallery-tile>span,.tile-b>span,.tile-c>span{
    left:20px;right:20px;bottom:18px;
    font:400 clamp(26px,7.5vw,33px)/1.03 var(--serif);
    overflow-wrap:normal;white-space:normal;
  }
  .gallery-tile .nuva-diagonal{width:12px;height:12px;margin-bottom:7px}
  .gallery-disclaimer{margin-top:15px;text-align:left;font-size:10px;line-height:1.6;color:#877c70}
  .gallery-tile.image-missing::after{background:rgba(25,23,21,.12)}
  .gallery-tile.image-missing{background:#aa9280}
  .gallery-tile.image-missing img{display:none!important}
  .service-image.image-missing{background:#b2a392}

  /* Quotation: single, structured column */
  .quote{padding:79px 0 86px}
  .quote-layout{display:flex;flex-direction:column;gap:30px}
  .quote-intro .display-title{margin:17px 0 15px;font-size:clamp(43px,11.2vw,58px)}
  .quote-intro>p{font-size:12px;line-height:1.8;margin:0}
  .quote-divider,.quote-side-note{display:none}
  .quote-form{padding-top:0}
  .form-row{display:flex;flex-direction:column;gap:0}
  .quote-form label{font-size:11px;margin-bottom:18px}
  .quote-form input,.quote-form select,.quote-form textarea{
    min-height:43px;font-size:14px;padding:12px 0;
    margin-top:4px;-webkit-appearance:none;appearance:none;
  }
  .quote-form textarea{min-height:93px}
  .form-hint{font-size:10px}
  .quote-form .btn{display:flex;width:100%;min-width:0;justify-content:space-between;margin-top:18px;padding:17px 20px;border-radius:0;font-size:10px}

  /* Footer is compact but not crowded */
  .footer{padding:59px 0 24px}
  .footer-top{display:flex;flex-direction:column;gap:43px;padding-bottom:60px}
  .footer-brand,.footer-brand img{width:118px}
  .footer-brand img{height:98px}
  .footer h2{font-size:clamp(47px,12vw,65px);margin-top:8px}
  .footer-links{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:0}
  .footer-links>div{min-width:0;gap:14px}
  .footer-links span{font-size:9px}
  .footer-links a,.footer-links p{font-size:11px}
  .footer-bottom{display:flex;flex-wrap:wrap;gap:17px;font-size:9px;line-height:1.6}
  .footer-bottom span:nth-child(2){display:none}

  /* Photograph enlargement stays inside the iPhone safe area */
  .lightbox{padding:80px 15px 87px}
  .lightbox-close{top:max(25px,env(safe-area-inset-top));right:18px}
  .lightbox>span{bottom:max(30px,env(safe-area-inset-bottom));left:22px;right:22px;font-size:20px}
}

/* Truly narrow phones: compact typography, never clipped CTA */
@media(max-width:360px){
  :root{--page:21px}
  .site-header,.site-header.scrolled{padding-inline:21px}
  .hero-content{padding-inline:21px}
  .hero h1{font-size:clamp(40px,11.55vw,44px)}
  .hero-actions{gap:15px}
  .hero-actions .btn{padding:12px 13px;gap:12px}
  .hero-actions .text-link{font-size:8px}
  .hero-eyebrow{letter-spacing:.13em}
}

@media(prefers-reduced-motion:reduce){
  .hero-image{animation:none!important}
  .gallery-tile img,.service-image img{transition:none!important}
}

/* NUVA V4 – Mobile layout audit: no fused words, no interactive galleries. */
html,body{max-width:100%;overflow-x:clip}
.manifesto h2{min-width:0;max-width:100%;overflow-wrap:normal}
.manifesto-heading{min-width:0}
.gallery-tile{cursor:default}
.gallery-tile:hover img{transform:none!important}
.gallery-tile b,.service-arrow{display:none!important}
.gallery-grid .gallery-tile{display:block}
.nuva-whatsapp{
  position:fixed;right:24px;bottom:24px;z-index:48;
  display:inline-flex;align-items:center;gap:11px;min-height:54px;
  padding:12px 20px 12px 14px;border-radius:999px;
  background:#17231c;color:#fff;
  box-shadow:0 5px 24px rgba(0,0,0,.16);border:1px solid rgba(255,255,255,.14);
  font:600 11px/1.2 var(--sans);letter-spacing:.025em;
  transition:transform .25s var(--ease),background .25s ease;
  -webkit-tap-highlight-color:transparent;
}
.nuva-whatsapp:hover{transform:translateY(-2px);background:#264232}
.nuva-whatsapp-icon{width:26px;height:26px;flex:none;color:#b8e3c2}
.nuva-whatsapp:focus-visible{outline:2px solid var(--terracotta);outline-offset:4px}
@media(max-width:950px){
 .manifesto-heading{display:block}
 .manifesto-mark{display:none}
 .manifesto h2{font-size:clamp(41px,6.8vw,67px);line-height:1.06;letter-spacing:-.028em}
 .manifesto h2 em{display:inline}
}
@media(max-width:600px){
 :root{--page:24px}
 .container{max-width:100%;min-width:0}
 .hero-content,.about-copy,.section-top,.quote-intro,.gallery-heading,.manifesto-heading{min-width:0;max-width:100%}
 .hero-heading-mobile>span,.hero-heading-mobile>em{white-space:normal}
 .hero h1{font-size:clamp(39px,10.6vw,54px);line-height:.97;letter-spacing:-.037em;overflow-wrap:normal}
 .hero-heading-mobile>span{display:block}
 .hero-actions{gap:12px;flex-wrap:wrap}
 .hero-actions .btn{font-size:10px;letter-spacing:.06em;padding:13px 16px}
 .hero-actions .text-link{font-size:10px;letter-spacing:.05em;padding:11px 2px}
 .display-title{font-size:clamp(38px,10vw,50px);line-height:1.03;letter-spacing:-.028em}
 .manifesto{padding:74px 0 79px}
 .manifesto-heading{display:block;padding:27px 0 36px}
 .manifesto h2{font:400 clamp(38px,10.1vw,47px)/1.07 var(--serif);letter-spacing:-.023em;max-width:100%;margin:0;overflow-wrap:normal;word-break:normal}
 .manifesto h2 br{display:none}
 .manifesto .principles{width:100%;min-width:0}
 .principle{grid-template-columns:23px minmax(0,1fr);gap:9px;padding:24px 0}
 .principle h3{font-size:clamp(26px,7.3vw,34px);line-height:1.08;overflow-wrap:normal}
 .principle p{font-size:12px;line-height:1.8}
 .gallery-grid .gallery-tile{width:100%;margin:0}
 .gallery-tile>span{font-size:clamp(28px,8vw,37px)}
 .quote-intro .display-title{font-size:clamp(38px,9.6vw,49px);line-height:1.04}
 .footer{padding-bottom:calc(110px + env(safe-area-inset-bottom))}
 .nuva-whatsapp{
   right:16px;bottom:calc(15px + env(safe-area-inset-bottom));
   min-height:51px;padding:11px 16px 11px 13px;gap:9px;
   font-size:11px;box-shadow:0 3px 16px rgba(0,0,0,.16)
 }
 .nuva-whatsapp-icon{width:24px;height:24px}
}
@media(max-width:360px){
 .manifesto h2{font-size:clamp(36px,10vw,39px)}
 .hero-actions .btn,.hero-actions .text-link{font-size:9px}
 .principle h3{font-size:26px}
 .nuva-whatsapp{right:12px;font-size:10px}
}
@media(prefers-reduced-motion:reduce){
 .nuva-whatsapp{transition:none}
}
/* A compact floating contact control keeps mobile content readable. */
@media(max-width:600px){
 .nuva-whatsapp{width:54px;min-width:54px;height:54px;min-height:54px;padding:13px;justify-content:center;gap:0;border-radius:50%;background:#1d3b2c}
 .nuva-whatsapp span{display:none}
 .nuva-whatsapp-icon{width:27px;height:27px;color:#e5ffea}
}