/* Bronvex: a useful front door. Brand typography and real navigation carry
   the composition; the shop remains a clearly separate future destination. */
:root{--ink:#14233c;--paper:#f5f7fb;--white:#fff;--blue:#2355e8;--blue-hover:#1944c4;--muted:#53627a;--line:#cbd5e4;--soft-line:#dde4ee;--ease:cubic-bezier(.2,.7,.25,1);color-scheme:light}
*{box-sizing:border-box;min-width:0}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:24px;scrollbar-gutter:stable}
html.shop-is-open{overflow-y:hidden}
body{margin:0;color:var(--ink);background:var(--paper);font:15px/1.7 'DM Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit;text-decoration:none}
button{color:inherit;font:inherit;cursor:pointer}
button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button:focus-visible,a:focus-visible{outline:2px solid var(--blue);outline-offset:5px}
::selection{color:#fff;background:var(--blue)}
svg{display:block;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
img{max-width:100%}
h1,h2{font-family:Manrope,system-ui,sans-serif}
.shell{width:min(1180px,calc(100% - 112px));margin-inline:auto}
.skip{position:fixed;top:-100px;left:20px;z-index:20;min-height:44px;padding:11px 18px;border-radius:7px;background:var(--blue);color:#fff;font-size:14px}
.skip:focus{top:12px}
.portal-header{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:80px;padding:15px max(56px,calc((100% - 1180px)/2));border-bottom:1px solid var(--soft-line);background:var(--white)}
.brand{display:flex;align-items:center;gap:21px;flex-shrink:0}
.brand-lockup{display:block;width:170px;height:auto}
.brand-caption{padding-left:21px;border-left:1px solid var(--line);color:var(--muted);font:500 10px/1.3 'DM Sans',sans-serif;letter-spacing:.1em;white-space:nowrap}
.header-tools{display:flex;align-items:center;gap:24px}
.header-contact{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);font-size:13px;text-decoration:underline;text-decoration-color:#a4b5d3;text-underline-offset:6px;transition:color .2s,text-decoration-color .2s}
.header-contact:hover{color:var(--blue);text-decoration-color:var(--blue)}
.header-tools button{display:grid;place-items:center;width:44px;height:44px;border:1px solid #8190a7;border-radius:7px;background:var(--white);font-size:12px;font-weight:500;transition:background .2s,border-color .2s}
.header-tools button:hover{border-color:#6b82b2;background:#edf2ff}

/* A compact typographic opening leaves the destinations in the first view. */
.gateway-hero{padding:40px 0 22px}
.gateway-copy h1{margin:0;color:var(--ink);font-size:clamp(54px,6.25vw,84px);font-weight:500;line-height:1.1;letter-spacing:-.06em}
.gateway-copy h1 em{display:inline-block;color:var(--blue);font-style:normal}
.gateway-introduction{margin-top:20px}
.gateway-intro{max-width:59ch;margin:0;color:var(--muted);font-size:16px;line-height:1.75}
.gateway-section-label{display:flex;align-items:center;gap:22px;padding:18px 0 20px;color:var(--muted);font-size:12px;font-weight:500;line-height:1.6}
.gateway-section-label:after{content:'';flex:1;height:1px;background:var(--line)}
.gateway-paths{display:flex;flex-direction:column;gap:16px;scroll-margin-top:24px}
.gateway-paths:focus-visible{outline:2px solid var(--blue);outline-offset:7px}
.gateway-path{border:1px solid var(--line);border-radius:14px}
.studio-path{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(290px,.8fr);gap:0 64px;padding:32px 36px 23px;color:var(--white);border-color:var(--blue);background:var(--blue)}
.path-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;font-size:11px;font-weight:500;letter-spacing:.035em;line-height:1.7}
.path-state{display:inline-flex;align-items:center;min-height:25px;padding:2px 8px;border:1px solid #ffffff73;border-radius:4px;font-size:10px;font-weight:500;letter-spacing:.02em;white-space:nowrap}
.studio-overview .path-top{justify-content:flex-start;gap:12px 22px}
.path-heading{margin-top:23px}
.path-heading h2{margin:0 0 17px;font-size:clamp(36px,3.65vw,49px);font-weight:500;line-height:1.1;letter-spacing:-.045em}
.path-heading h2>span{font-weight:400}
.path-heading>p{max-width:44ch;margin:0;color:#f0f4ff;font-size:15px;line-height:1.75}
.path-destination{display:flex;align-items:center;margin-top:23px}
.path-action{display:flex;align-items:center;justify-content:space-between;gap:38px;min-height:53px;padding:13px 17px;border:1px solid var(--white);border-radius:7px;color:var(--blue-hover);background:var(--white);font-size:14px;font-weight:600;line-height:1.6;text-align:left;transition:background .22s,border-color .22s,transform .22s var(--ease)}
.path-action svg{width:20px;height:20px;flex-shrink:0;stroke-width:1.5;transition:transform .22s var(--ease)}
.path-action:hover{background:#eaf0ff;border-color:#eaf0ff}
.path-action:hover svg,.path-action:focus-visible svg{transform:translateX(3px)}
.path-action:active{transform:translateY(1px)}
.studio-path a:focus-visible{outline-color:#fff;outline-offset:5px}

/* This is navigation into the real Studio page, not a simulated portfolio. */
.studio-map{align-self:stretch;padding-left:31px;border-left:1px solid #ffffff57}
.map-caption{margin:1px 0 16px;color:#e3ebff;font-size:12px;line-height:1.6}
.map-links{display:flex;flex-direction:column}
.map-links>a{display:flex;align-items:center;justify-content:space-between;gap:17px;min-height:70px;padding:11px 0;border-bottom:1px solid #ffffff47;transition:color .2s}
.map-links>a:last-child{border-bottom:0}
.map-link-copy{display:flex;flex-direction:column;gap:2px}
.map-link-copy strong{font-size:16px;font-weight:500;line-height:1.5}
.map-link-copy>span{color:#e3ebff;font-size:12px;line-height:1.6}
.map-links svg{width:21px;height:21px;flex-shrink:0;stroke-width:1.5;transition:transform .22s var(--ease)}
.map-links>a:hover svg,.map-links>a:focus-visible svg{transform:translateX(3px)}
.map-links>a:hover .map-link-copy strong{text-decoration:underline;text-underline-offset:4px}
.path-assurance{grid-column:1/-1;display:flex;align-items:flex-start;gap:9px;margin-top:26px;padding-top:17px;border-top:1px solid #ffffff54;color:#edf2ff;font-size:12px;line-height:1.7}
.path-assurance svg{width:17px;height:17px;flex-shrink:0;margin-top:1px;stroke-width:1.6}

.shop-path{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:30px;padding:25px 32px 26px;background:#e9eef7;border-color:#d1dbea}
.shop-path .path-top{justify-content:flex-start;gap:12px 19px;color:#53627a}
.shop-path .path-state{padding-inline:9px;border-color:#a7b7d0;color:#425778;background:#f5f7fb}
.shop-path .path-heading{margin-top:13px}
.shop-path .path-heading h2{margin-bottom:11px;font-size:30px;line-height:1.1;letter-spacing:-.04em}
.shop-path .path-heading h2 span{font-weight:500}
.shop-path .path-heading>p{max-width:56ch;color:var(--muted);font-size:14px;line-height:1.8}
.shop-path .path-destination{margin-top:0}
.shop-path .path-action{gap:28px;min-height:49px;padding:11px 0;border:0;border-bottom:1px solid #91a5c4;border-radius:0;color:var(--ink);background:transparent;font-size:13px;font-weight:500}
.shop-path .path-action:hover,.shop-path .path-action:focus-visible{color:var(--blue);border-color:var(--blue)}
.shop-noscript{display:inline-flex;min-height:44px;align-items:center;font-size:13px;text-decoration:underline}
.gateway-signature{padding:22px 0;color:var(--muted);font-size:12px;line-height:1.8}
.portal-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px 25px;padding:16px 0 28px;border-top:1px solid var(--line);color:var(--muted);font-size:11px}
.portal-footer a{display:inline-flex;align-items:center;gap:12px;min-height:44px;color:var(--ink);font-size:14px;transition:color .2s}
.portal-footer a:hover{color:var(--blue)}
.portal-footer svg{width:15px;height:15px;stroke-width:1.5}
.footer-location{font-size:10px;letter-spacing:.035em}
.footer-meta{display:flex;align-items:center;flex-wrap:wrap;gap:4px 21px}
.portal-footer .footer-privacy{color:var(--muted);font-size:12px;text-decoration:underline;text-underline-offset:3px}

/* The close target stays visible while the status dialog itself scrolls. */
#shop-dialog{width:min(570px,calc(100% - 40px));max-height:calc(100svh - 40px);padding:0 36px 29px;overflow-y:auto;overscroll-behavior:contain;border:1px solid #c7d2e4;border-radius:14px;color:var(--ink);background:var(--white);box-shadow:0 35px 100px #07132640}
#shop-dialog::backdrop{background:#0d1b36a8;backdrop-filter:blur(7px)}
#shop-dialog[open]{animation:portal-dialog-in .24s var(--ease)}
.dialog-close{position:sticky;top:12px;z-index:1;display:grid;place-items:center;width:44px;height:44px;margin:14px -20px 0 auto;border:1px solid #8190a7;border-radius:7px;color:var(--ink);background:#fff}
.dialog-close:hover{color:var(--blue);border-color:#6b82b2;background:#f1f5ff}
.dialog-close svg{width:18px;height:18px;stroke-width:1.6}
.shop-brand-logo{display:block;width:174px;height:auto;margin:-13px 0 30px}
#shop-dialog .eyebrow{display:block;color:var(--blue);font-size:11px;font-weight:500;letter-spacing:.055em;line-height:1.6}
#shop-dialog h2{margin:19px 0 22px;font-size:43px;font-weight:500;line-height:1.12;letter-spacing:-.05em}
#shop-dialog p{margin:0;color:var(--muted);font-size:15px;line-height:1.85}
.dialog-status{display:grid;grid-template-columns:1fr 1fr;margin:25px 0 24px;padding:18px 20px;border:1px solid #d6e1f7;border-radius:7px;background:#f2f6ff}
.dialog-status div+div{padding-left:20px;border-left:1px solid #cfdbf4}
.dialog-status dt{color:var(--muted);font-size:12px;line-height:1.6}
.dialog-status dd{margin:5px 0 0;color:var(--ink);font-size:15px;line-height:1.5;font-weight:500}
.dialog-contact-label{display:block;color:var(--muted);font-size:12px;line-height:1.7}
.dialog-contact{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:50px;padding:11px 0;border-bottom:1px solid #b7c8e8;color:var(--ink);font-size:15px;line-height:1.7}
.dialog-contact:hover{color:var(--blue)}
.dialog-contact svg{width:20px;height:20px;flex-shrink:0;stroke-width:1.5}
@keyframes portal-dialog-in{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}

@media(min-width:1600px){.gateway-hero{padding-top:49px}}
@media(max-width:1100px){
 .shell{width:calc(100% - 80px)}.portal-header{padding-inline:40px}.brand-caption{display:none}
 .gateway-copy h1{font-size:clamp(54px,6.7vw,73px)}.gateway-intro{font-size:15px}
 .studio-path{grid-template-columns:minmax(0,1.1fr) minmax(260px,.8fr);column-gap:38px;padding:28px 30px 23px}
 .path-heading h2{font-size:41px}.path-heading>p{font-size:14px}.studio-map{padding-left:26px}.map-link-copy strong{font-size:15px}.map-link-copy>span{font-size:11px}
 .shop-path{padding-inline:28px}.footer-meta{gap:4px 15px}
}
@media(max-width:840px){
 .shell{width:calc(100% - 48px)}.portal-header{padding-inline:24px}.brand-lockup{width:160px}
 .gateway-hero{padding-top:32px}.gateway-copy h1{font-size:56px}.gateway-intro{font-size:14px}
 .studio-path{column-gap:27px;padding-inline:26px;grid-template-columns:minmax(0,1fr) minmax(230px,.8fr)}.path-top{font-size:10px;letter-spacing:.015em;gap:7px 13px}.path-state{font-size:10px}.path-heading h2{font-size:35px}.studio-map{padding-left:23px}.map-link-copy>span{font-size:11px}.path-assurance{font-size:11px}
 .shop-path{padding-inline:25px}.shop-path .path-heading h2{font-size:28px}.shop-path .path-heading>p{font-size:13px}
 .portal-footer{justify-content:flex-start;gap:8px 25px}.footer-meta{margin-left:auto}
}
@media(max-width:760px){
 .studio-path{grid-template-columns:1fr}.path-heading h2{font-size:39px}.studio-map{margin-top:26px;padding:20px 0 0;border-left:0;border-top:1px solid #ffffff57}.map-caption{margin:0 0 10px}.map-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.map-links>a{min-height:47px;padding:7px 0;border:0;gap:10px}.map-link-copy strong{font-size:14px}.map-link-copy>span{display:none}.map-links svg{width:19px;height:19px}.path-assurance{margin-top:20px}
}
@media(max-width:680px){
 .shell{width:calc(100% - 40px)}.portal-header{min-height:75px;padding:13px 20px}.brand-lockup{width:148px}.header-tools{gap:6px}.header-contact{display:none}
 .gateway-hero{padding:28px 0 17px}.gateway-copy h1{font-size:clamp(46px,11.9vw,64px);line-height:1.07;letter-spacing:-.06em}.gateway-introduction{margin-top:17px}.gateway-intro{max-width:42ch;font-size:14px;line-height:1.75}
 .gateway-section-label{padding-block:15px 17px;font-size:11px;gap:14px}.gateway-paths{gap:14px}.studio-path{padding:23px 24px 21px}.studio-overview .path-top{justify-content:space-between;gap:9px;font-size:11px}.path-state{font-size:10px;padding-inline:6px}.path-heading{margin-top:21px}.path-heading h2{margin-bottom:17px;font-size:clamp(30px,8.3vw,42px)}.path-heading>p{max-width:39ch;font-size:14px;line-height:1.75}.path-destination{margin-top:21px}.path-action{width:100%;min-height:53px;padding:13px 15px;font-size:14px}
 .studio-map{margin-top:23px;padding-top:14px}.map-caption{font-size:11px;margin-bottom:6px}.map-links{gap:14px}.map-links>a{min-height:44px;gap:7px}.map-link-copy strong{font-size:13px}.map-links svg{width:17px;height:17px}.path-assurance{margin-top:15px;padding-top:14px;font-size:11px}
 .shop-path{grid-template-columns:1fr;gap:0;padding:23px 24px 20px}.shop-path .path-top{align-items:center;justify-content:space-between;gap:12px;font-size:10px}.shop-path .path-state{font-size:10px}.shop-path .path-heading{margin-top:17px}.shop-path .path-heading h2{margin-bottom:13px;font-size:29px}.shop-path .path-heading>p{max-width:39ch;font-size:14px;line-height:1.8}.shop-path .path-destination{margin-top:17px}.shop-path .path-action{font-size:13px;min-height:48px;width:100%}
 .gateway-signature{padding-block:21px;font-size:12px}.portal-footer{align-items:flex-start;flex-direction:column;gap:5px;padding-block:18px 25px}.footer-meta{margin-left:0;gap:4px 18px}.footer-location{font-size:10px;letter-spacing:.015em}.portal-footer a{font-size:14px}.portal-footer .footer-privacy{font-size:12px}
 #shop-dialog{width:calc(100% - 32px);max-height:calc(100svh - 32px);padding-inline:25px;padding-bottom:25px}.dialog-close{margin-right:-12px;top:10px}.shop-brand-logo{width:150px;margin-top:-13px;margin-bottom:26px}#shop-dialog h2{font-size:clamp(32px,8.6vw,40px);margin-block:17px 21px}#shop-dialog p{font-size:14px}.dialog-status{padding:16px}.dialog-status div+div{padding-left:16px}.dialog-contact{font-size:14px}
}
@media(max-width:380px){
 .shell{width:calc(100% - 32px)}.portal-header{padding-inline:16px}.brand-lockup{width:142px}.gateway-copy h1{font-size:42px}.gateway-intro{font-size:13px}.studio-path{padding-inline:20px}.studio-overview .path-top{gap:7px;font-size:11px;letter-spacing:0}.path-state{font-size:10px}.path-heading h2{font-size:30px}.path-heading>p{font-size:13px}.path-action{font-size:13px}.studio-map{margin-top:22px}.map-links{gap:10px}.map-link-copy strong{font-size:12px}.map-links svg{width:15px;height:15px}.path-assurance{font-size:11px}.shop-path{padding-inline:20px}.shop-path .path-heading h2{font-size:28px}.shop-path .path-heading>p{font-size:13px}
 .shop-brand-logo{width:130px}.dialog-contact{gap:10px;font-size:13px}.dialog-status{gap:0;padding-inline:13px}.dialog-status div+div{padding-left:13px}.dialog-status dd{font-size:14px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.path-action:active,.path-action:hover svg,.path-action:focus-visible svg,.map-links>a:hover svg,.map-links>a:focus-visible svg{transform:none}}
@media(forced-colors:active){.gateway-path,.header-tools button,.path-action,#shop-dialog,.dialog-close,.path-state{border:1px solid CanvasText}.gateway-copy h1 em{color:LinkText}.studio-path{color:CanvasText;background:Canvas}.studio-path .path-heading>p,.map-caption,.map-link-copy>span,.path-assurance{color:CanvasText}.studio-path a:focus-visible{outline-color:Highlight}.path-action svg,.map-links svg{color:LinkText}.studio-map,.path-assurance,.map-links>a{border-color:CanvasText}}

