/* ParenzanaTrail.com — real-device responsive correction, 2026-09-24
   Loaded after style.css intentionally. */

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
html,body{width:100%;max-width:100%;overflow-x:hidden}
.site-header .nav-shell{position:relative}
.display,.page-hero .display{
  word-break:normal;
  overflow-wrap:normal;
  hyphens:none;
}

/* Make the compact navigation kick in before the desktop header becomes crowded. */
@media (max-width:1240px){
  .site-header .nav-shell{min-height:40px}
  .site-header .menu-toggle{display:block}
  .site-header .nav-links{
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    height:100vh;
    height:100dvh;
    width:min(88vw,430px);
    margin:0;
    padding:112px 34px max(42px,env(safe-area-inset-bottom));
    background:rgba(8,23,16,.985);
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    gap:12px;
    transform:translateX(104%);
    transition:transform .3s ease;
    overflow-y:auto;
    overscroll-behavior:contain;
    z-index:102;
    box-shadow:-28px 0 70px rgba(0,0,0,.18);
  }
  .site-header .nav-links.open{transform:translateX(0)}
  .site-header .nav-links>a{
    font-family:var(--serif);
    font-size:clamp(1.9rem,3.3vw,2.35rem);
    line-height:1.03;
    font-weight:300;
    opacity:.92;
  }
  .site-header .nav-links .nav-cta{
    font-family:var(--sans);
    font-size:.69rem;
    line-height:1.25;
    padding:10px 14px;
    margin-top:14px;
  }
}

/* PHONE HEADER
   Brand stays top-left, menu stays top-right, languages become a deliberate second line. */
@media (max-width:760px){
  .site-header,
  .site-header.scrolled{
    box-sizing:border-box;
    height:96px;
    min-height:96px;
    padding:12px 14px !important;
  }
  .site-header.scrolled{
    background:rgba(9,23,17,.955);
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .site-header .nav-shell{
    width:100%;
    max-width:none;
    height:72px;
    margin:0;
    padding:0;
    display:block !important;
  }
  .site-header .brand{
    position:absolute;
    left:0;
    top:0;
    z-index:104;
    display:inline-flex;
    align-items:center;
    gap:10px;
    width:auto;
    max-width:calc(100% - 58px);
    margin:0;
    font-size:.94rem;
    line-height:1.1;
    white-space:nowrap;
  }
  .site-header .brand-mark{
    width:34px;
    height:34px;
    flex:0 0 34px;
  }
  .site-header .brand small{
    display:block !important;
    margin-top:4px;
    font-size:.48rem;
    letter-spacing:.18em;
    line-height:1;
  }
  .site-header .header-tools{
    position:static !important;
    display:block !important;
    width:100%;
    margin:0 !important;
    padding:0;
  }
  .site-header .menu-toggle{
    position:absolute !important;
    top:-3px !important;
    right:-5px !important;
    left:auto !important;
    z-index:105;
    width:44px;
    height:44px;
    margin:0 !important;
    padding:0;
  }
  .site-header .menu-toggle:before,
  .site-header .menu-toggle:after,
  .site-header .menu-toggle span{
    left:9px;
    right:9px;
  }
  .site-header .language-strip,
  .site-header.scrolled .language-strip{
    position:absolute !important;
    top:54px !important;
    right:0 !important;
    left:auto !important;
    bottom:auto !important;
    z-index:104;
    display:flex !important;
    flex-flow:row nowrap !important;
    align-items:center;
    justify-content:flex-end;
    width:max-content !important;
    max-width:calc(100vw - 28px) !important;
    margin:0 !important;
    padding:0 !important;
    gap:8px !important;
    overflow:visible !important;
    white-space:nowrap;
    line-height:1;
  }
  .site-header .lang-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:0 !important;
    margin:0 !important;
    padding:0 0 3px !important;
    font-size:.55rem !important;
    line-height:1 !important;
    letter-spacing:.07em !important;
    font-weight:500;
  }

  .site-header .nav-links{
    width:min(90vw,390px);
    padding:122px 28px max(44px,env(safe-area-inset-bottom));
    z-index:102;
  }
  .site-header .nav-links>a{font-size:2rem}

  /* Hero: force a single full-width text column on real mobile browsers. */
  .hero,.page-hero{width:100%;min-width:0}
  .hero{min-height:100svh}
  .page-hero{min-height:68svh}
  .hero .hero-content,
  .page-hero .hero-content{
    width:min(100% - 32px,1220px);
    padding-top:150px !important;
    padding-bottom:58px !important;
  }
  .hero .hero-grid,
  .page-hero .hero-grid{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }
  .hero .hero-grid>* ,
  .page-hero .hero-grid>*{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }
  .hero .kicker,.page-hero .kicker{
    display:block;
    margin-bottom:16px;
    font-size:.62rem;
    letter-spacing:.2em;
  }
  .hero .display,
  .page-hero .display{
    width:auto !important;
    max-width:10.6ch !important;
    margin:.04em 0 .23em !important;
    font-size:clamp(3.2rem,14vw,3.75rem) !important;
    line-height:.9 !important;
    letter-spacing:-.043em !important;
    text-wrap:wrap !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
  }
  .hero p,.page-hero p{
    width:100%;
    max-width:34ch;
    margin-top:0;
    font-size:.93rem !important;
    line-height:1.6 !important;
  }
  .hero-actions{
    margin-top:24px;
    gap:9px;
  }
  .hero-actions .btn{
    min-height:45px;
    padding:12px 19px;
    font-size:.72rem;
  }
  .hero-aside{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
    width:100%;
    margin-top:34px;
    padding:22px 0 0;
    border-left:0;
    border-top:1px solid rgba(255,255,255,.25);
  }
  .hero-aside strong{font-size:2rem}
  .hero-aside span{font-size:.5rem}
  .hero-home .hero-bg{background-position:58% center !important}
  .page-hero .hero-bg{background-position:center !important}
  .photo-credit{right:12px;bottom:10px;max-width:68%;font-size:.47rem;line-height:1.35;text-align:right}

  /* Correct the invalid mobile width expression in the base stylesheet. */
  .container{width:min(1220px,calc(100% - 32px)) !important}

  /* Headings and grids remain elegant instead of becoming poster-sized. */
  .section-title{
    max-width:12ch;
    font-size:clamp(2.75rem,12vw,3.9rem) !important;
    line-height:.94 !important;
    text-wrap:balance;
  }
  .band-inner h2{font-size:clamp(2.7rem,11.5vw,3.55rem) !important}
  .prose h2{font-size:clamp(2.65rem,11vw,3.3rem) !important}
  .guide-grid,.planning-grid,.commercial-services,.decision-grid,.place-grid,.journal-grid{grid-template-columns:1fr !important}
  .stats,.metric-grid,.fact-table{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .fact-table>div,.stat,.metric-grid>div{min-width:0;overflow-wrap:anywhere}
  .map-shell{max-width:100%;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
  .booking-form input,.booking-form select,.booking-form textarea{width:100%;max-width:100%;min-width:0}
}

@media (max-width:430px){
  .site-header,
  .site-header.scrolled{height:94px;min-height:94px;padding-left:12px !important;padding-right:12px !important}
  .site-header .nav-shell{height:70px}
  .site-header .brand{font-size:.88rem;gap:9px;max-width:calc(100% - 54px)}
  .site-header .brand-mark{width:32px;height:32px;flex-basis:32px}
  .site-header .brand small{font-size:.45rem}
  .site-header .language-strip,
  .site-header.scrolled .language-strip{top:52px !important;right:0 !important;gap:7px !important;max-width:calc(100vw - 24px) !important}
  .site-header .lang-link{font-size:.52rem !important;letter-spacing:.055em !important}
  .hero .hero-content,.page-hero .hero-content{padding-top:146px !important}
  .hero .display,.page-hero .display{font-size:clamp(3.05rem,13.7vw,3.45rem) !important;max-width:10.8ch !important}
  .hero p,.page-hero p{font-size:.9rem !important;max-width:33ch}
  .hero-aside{margin-top:30px}
  .footer-grid{grid-template-columns:1fr !important}
  .footer-brand{grid-column:auto !important}
}

@media (max-width:360px){
  .site-header .language-strip,
  .site-header.scrolled .language-strip{gap:5px !important}
  .site-header .lang-link{font-size:.49rem !important;letter-spacing:.035em !important}
  .hero .display,.page-hero .display{font-size:2.95rem !important;max-width:10.5ch !important}
  .hero .hero-content,.page-hero .hero-content{padding-top:142px !important}
  .hero-actions .btn{padding-left:16px;padding-right:16px}
}