/* GP Express — visual upgrade, 2026-08-30 */
:root{--paper:#f7f1e7;--paper-2:#e9dfd0;--ink:#12100d;--ink-2:#504b44;--ink-3:#777067;--brand:#bb2a20;--brand-2:#861a14;--brand-3:#e7b9b3;--pop:#f04a36;--shell:1180px}
html{scroll-padding-top:92px}
body{background:var(--paper);background-image:radial-gradient(circle at 12% 2%,#fff9 0,transparent 25rem),linear-gradient(90deg,#00000008 1px,transparent 1px),linear-gradient(#00000008 1px,transparent 1px);background-size:auto,32px 32px,32px 32px}
body:before{content:"GPX / MARSEILLE";position:fixed;right:-62px;top:50%;z-index:30;rotate:90deg;font:600 9px/1 var(--mono);letter-spacing:.34em;color:var(--ink);opacity:.32;pointer-events:none}
.wrap{max-width:var(--shell)}
.masthead{top:12px;left:50%;right:auto;width:min(calc(100% - 32px),1160px);translate:-50% 0;border:2px solid var(--ink);border-radius:2px;background:#f7f1e7e8;box-shadow:6px 6px 0 #12100d;backdrop-filter:blur(14px);transform:translateY(-150%)}
.masthead.is-visible{transform:translateY(0)}
.masthead-in{padding:9px 14px}
.mh-logo img{width:42px;height:42px;filter:drop-shadow(2px 2px 0 #fff)}
.mh-cta,.btn{border-width:2px;text-transform:uppercase;font-weight:600;letter-spacing:.08em}
.mh-cta{background:var(--brand);color:#fff!important;box-shadow:3px 3px 0 var(--ink);padding:9px 15px}
.mh-cta:hover{background:var(--pop);color:#fff!important;transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink)}
.hero{min-height:min(920px,100svh);display:grid;align-content:center;padding-block:clamp(72px,10vw,132px) 42px;position:relative;overflow:hidden;background:linear-gradient(135deg,#fff8 0 45%,transparent 45%),radial-gradient(circle at 84% 28%,#bb2a2020 0 18rem,transparent 18.1rem)}
.hero:before{content:"20";position:absolute;right:-.03em;top:-.24em;font:700 clamp(18rem,45vw,43rem)/1 var(--mono);letter-spacing:-.14em;color:transparent;-webkit-text-stroke:2px #12100d0c;pointer-events:none}
.hero-grid{grid-template-columns:minmax(0,1fr) clamp(240px,26vw,330px);gap:clamp(34px,7vw,92px)}
.kicker{color:var(--ink);font-weight:500}.kicker b{background:var(--brand);color:#fff;padding:4px 8px;box-shadow:3px 3px 0 var(--ink)}
h1{font-size:clamp(2.65rem,7.2vw,5.45rem);line-height:.98;letter-spacing:-.055em;max-width:12ch}
h1 .mono-line{display:block;font-size:.44em;line-height:1.3;letter-spacing:-.035em;margin-bottom:.24em;color:var(--ink-2)}
.brandline{display:block;filter:none!important}.bl-line{display:block}.bl-ink{position:relative;z-index:1}.bl-ink:after{content:"";position:absolute;left:-.04em;right:-.06em;bottom:.02em;height:.2em;background:var(--brand-3);z-index:-1;rotate:-1deg}
.h1-sub{font-size:clamp(1rem,1.7vw,1.28rem);border-left:5px solid var(--brand);padding-left:18px;max-width:58ch}
.btn{padding:14px 20px;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.btn-solid{box-shadow:5px 5px 0 var(--ink)}.btn-solid:hover{transform:translate(-3px,-3px);box-shadow:8px 8px 0 var(--ink)}.btn-ghost{background:#fff8}.btn-ghost:hover{transform:rotate(-1deg)}
.avatar-card{padding:14px 14px 52px;box-shadow:14px 18px 0 var(--ink);rotate:3deg;transition:rotate .35s ease,transform .35s ease}.avatar-card:hover{rotate:-2deg;transform:translateY(-8px)}.avatar-card img{display:block;width:100%;height:auto;image-rendering:pixelated}.avatar-cap{font-family:Kalam,cursive;font-size:16px}
.proof{margin-top:clamp(44px,7vw,76px);border:2px solid var(--ink);background:#fff8;box-shadow:7px 7px 0 var(--ink)}.proof div{padding:22px;border-left:2px solid var(--ink)}.proof div:first-child{padding-left:22px}.proof b{font-size:clamp(1.45rem,3.4vw,2.25rem);color:var(--brand);line-height:1}.proof span{display:block;margin-top:7px;line-height:1.35}
.ticker{border-block:3px solid var(--ink)!important;rotate:-.7deg;scale:1.02;background:var(--brand)!important;color:#fff!important}.ticker *{color:#fff!important}
.band{padding-block:clamp(70px,10vw,124px)}
.band:before{height:38px;background:url(/img/torn-line.svg) repeat-x top center,linear-gradient(to bottom,#14120f18,#14120f00 72%)}
.band--tint{background:#eadfce;background-image:radial-gradient(#12100d14 1px,transparent 1px);background-size:17px 17px}
.sec-head{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:18px;margin-bottom:48px;border-bottom:3px solid var(--ink);padding-bottom:14px}.sec-no{font-size:12px;background:var(--ink);color:#fff;padding:7px 9px}.sec-head h2{font-size:clamp(1.85rem,5vw,3.5rem);line-height:.95;letter-spacing:-.05em}.sec-link{font-weight:600}
.lede{font-size:clamp(1rem,1.8vw,1.25rem);margin-bottom:42px}
.offer{gap:18px;border:0}.offer>article,.offer>article:first-child,.offer>article:last-child{position:relative;padding:28px;border:2px solid var(--ink);background:#fff9;box-shadow:7px 7px 0 var(--ink);transition:transform .25s ease,box-shadow .25s ease}.offer>article:hover{transform:translate(-4px,-6px) rotate(-.5deg);box-shadow:12px 14px 0 var(--brand)}.offer>article:nth-child(2):hover{rotate:.5deg}.o-icon{width:72px!important;height:72px!important;filter:drop-shadow(4px 4px 0 #e7b9b3)}.o-no{position:absolute;right:18px;top:14px;font-size:2.6rem;line-height:1;color:#12100d18}.offer h3{font-size:1.25rem;margin:18px 0 12px}.o-points li{padding-block:10px}
.cred{border:2px solid var(--ink);background:var(--brand);color:#fff;padding:clamp(24px,5vw,56px);box-shadow:10px 10px 0 var(--ink);rotate:-.5deg}.cred *{color:#fff!important}.cred-kicker{letter-spacing:.2em}.cred-name{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:7px}
.showcase-intro{font-size:clamp(1rem,1.7vw,1.25rem)!important;max-width:70ch}
.site-wall{perspective:1100px}.site-card,.browser-card,.polaroid{border:2px solid var(--ink)!important;box-shadow:10px 12px 0 #12100d!important;transition:transform .3s ease,box-shadow .3s ease!important}.site-card:hover,.browser-card:hover,.polaroid:hover{transform:translateY(-10px) rotateX(1deg)!important;box-shadow:15px 20px 0 var(--brand)!important}
.method{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;border:0}.step{grid-template-columns:74px 1fr;border:2px solid var(--ink);padding:26px;background:#fff9;box-shadow:6px 6px 0 var(--ink);transition:transform .22s ease}.step:hover{transform:translateY(-5px)}.step-no{font-size:2.8rem}.step h3{font-size:1.3rem}
.histoire-grid{gap:clamp(40px,8vw,96px)!important}.prose--lead{font-size:clamp(1rem,1.55vw,1.16rem)}.mascot-card{border:2px solid var(--ink)!important;background:#fff!important;box-shadow:12px 14px 0 var(--brand)!important;rotate:2deg}.mascot-card img{image-rendering:pixelated}
.qa{max-width:none;display:grid;grid-template-columns:1fr 1fr;border:2px solid var(--ink);background:#fff8;box-shadow:8px 8px 0 var(--ink)}.qa>div{padding:28px;border:0;border-bottom:1px solid var(--ink);border-right:1px solid var(--ink)}.qa>div:nth-child(even){border-right:0}.qa h3{font-size:1.1rem}.qa>div:hover{background:#fff}
.band--redwave{background:var(--brand)!important;color:#fff!important;border-block:4px solid var(--ink);overflow:hidden}.band--redwave:after{content:"GPX";position:absolute;right:-.05em;bottom:-.4em;font:700 clamp(12rem,32vw,28rem)/1 var(--mono);color:#ffffff0a;letter-spacing:-.12em;pointer-events:none}.rw-in{position:relative;z-index:2}.rw-in h2{font-size:clamp(2.7rem,8vw,6rem)!important;letter-spacing:-.06em!important}.rw-in .btn{background:#fff!important;color:var(--ink)!important;box-shadow:7px 7px 0 var(--ink)}
.site-footer{background:var(--ink)!important;color:#eee!important;border-top:0!important}.site-footer a,.site-footer .foot-name{color:#fff!important}.site-footer a:hover{background:var(--brand)!important}.foot-name{font-size:clamp(2rem,4vw,3.5rem)!important}
@media(max-width:820px){body:before{display:none}.hero{min-height:auto;padding-top:58px}.hero-grid{grid-template-columns:1fr}.hero-portrait{order:0!important;max-width:210px!important;margin:12px auto 8px}.avatar-card{box-shadow:9px 11px 0 var(--ink)}.proof{grid-template-columns:1fr 1fr}.proof div,.proof div:first-child{padding:17px}.proof div:nth-child(3){border-left:0}.offer{grid-template-columns:1fr}.method{grid-template-columns:1fr}.sec-head{grid-template-columns:auto 1fr}.sec-link{grid-column:2}.qa{grid-template-columns:1fr}.qa>div{border-right:0}.qa>div:last-child{border-bottom:0}}
@media(max-width:560px){.masthead{top:8px;width:calc(100% - 20px);box-shadow:4px 4px 0 var(--ink)}.hero{padding-top:42px}.hero-grid{gap:18px}h1{font-size:clamp(2.45rem,13vw,4rem)}.h1-sub{font-size:.96rem}.cta-row{display:grid}.btn{justify-content:center}.proof{box-shadow:5px 5px 0 var(--ink)}.proof b{font-size:1.35rem}.proof span{font-size:10px}.band{padding-block:64px}.sec-head{margin-bottom:34px}.offer>article,.step{box-shadow:5px 5px 0 var(--ink)}.qa{box-shadow:5px 5px 0 var(--ink)}}
@media(prefers-reduced-motion:no-preference){.hero-copy{animation:gpx-rise .65s cubic-bezier(.2,.8,.2,1) both}.hero-portrait{animation:gpx-rise .65s .12s cubic-bezier(.2,.8,.2,1) both}.proof{animation:gpx-rise .65s .22s cubic-bezier(.2,.8,.2,1) both}@keyframes gpx-rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}}
