/* Custom Grip Patterns page — image-led sole design studio. */
.gss-pattern-page{--pattern-ink:#081d2e;--pattern-navy:#12355b;--pattern-orange:#f26b38;--pattern-line:#d7e1e7;--pattern-soft:#edf3f5;background:#fff}
.gss-pattern-page .gss-proto-intro h2{margin:12px 0 16px!important}
.gss-pattern-page a:not(.gss-proto-btn){color:var(--pattern-navy);font-weight:750;text-decoration:underline;text-decoration-color:rgba(242,107,56,.48);text-underline-offset:3px}
.gss-pattern-hero{position:relative;overflow:hidden;padding:clamp(70px,8vw,108px) 0;color:#fff;background:radial-gradient(circle at 12% 12%,rgba(242,107,56,.19),transparent 28%),var(--pattern-ink)}
.gss-pattern-hero:after{position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.06) 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(90deg,#000,transparent 72%);content:"";pointer-events:none}
.gss-pattern-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.88fr) minmax(480px,1.12fr);gap:clamp(46px,7vw,96px);align-items:center}
.gss-pattern-hero-copy h1{max-width:760px;margin:0;color:#fff;font-size:clamp(3rem,5.7vw,5.9rem);line-height:.96;letter-spacing:-.055em}
.gss-pattern-hero-copy>p:not(.gss-proto-kicker){max-width:650px;margin:26px 0 0;color:#c8d7e1;font-size:1.08rem}
.gss-pattern-hero-media{position:relative;display:grid;place-items:center;margin:0;min-height:570px;overflow:hidden;background:radial-gradient(circle at 72% 22%,rgba(242,107,56,.18),transparent 31%),linear-gradient(145deg,#173b56,#0b243b 68%);box-shadow:0 30px 80px rgba(0,0,0,.34)}
.gss-pattern-hero-media:before{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:32px 32px;content:""}
.gss-pattern-hero-media figcaption{position:absolute;z-index:3;right:24px;bottom:22px;left:24px;display:grid;gap:4px}
.gss-pattern-hero-media figcaption strong{color:#ff9b77;font:800 11px/1.2 Manrope,sans-serif;letter-spacing:.12em}
.gss-pattern-hero-media figcaption span{font-size:13px;font-weight:700}
.gss-grip-sole-diagram{position:relative;z-index:1;width:178px;height:320px;overflow:visible;transform:rotate(-5deg);filter:drop-shadow(0 24px 22px rgba(8,29,46,.23))}
.gss-grip-sole-diagram.is-hero{width:min(70%,350px);height:500px;filter:drop-shadow(0 30px 30px rgba(0,0,0,.38))}
.gss-sole-base{fill:#f5efe6}
.gss-sole-outline{fill:none;stroke:#aebcc4;stroke-width:4}
.gss-hero-grip path{fill:none;stroke:rgba(242,107,56,.38);stroke-width:5}
.gss-hero-grip circle,.gss-hero-grip rect,.gss-logo-grip circle,.gss-logo-grip rect{fill:var(--pattern-orange)}
.gss-hero-grip text,.gss-logo-grip text{fill:#fff;font:800 14px/1 Manrope,sans-serif;text-anchor:middle;letter-spacing:.04em}
.gss-repeat-fill{fill:url(#gss-dot-pattern)}
#gss-dot-pattern circle{fill:var(--pattern-orange)}
.gss-direction-grip path{fill:none;stroke:var(--pattern-orange);stroke-width:18;stroke-linecap:round;stroke-linejoin:round}

.gss-pattern-options{padding:clamp(72px,8vw,104px) 0!important}
.gss-pattern-options .gss-proto-intro{max-width:850px}
.gss-pattern-option-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.gss-pattern-option-grid article{overflow:hidden;border:1px solid var(--pattern-line);background:#fff;transition:transform .22s ease,box-shadow .22s ease}
.gss-pattern-option-grid article:hover{transform:translateY(-5px);box-shadow:0 22px 48px rgba(11,36,59,.13)}
.gss-pattern-option-grid figure{position:relative;display:grid;place-items:center;margin:0;height:360px;overflow:hidden;background:radial-gradient(circle at 50% 42%,#fff 0,#f3f6f7 48%,#e7eef1 100%)}
.gss-pattern-option-grid figure:after{position:absolute;inset:18px;border:1px solid rgba(18,53,91,.09);content:"";pointer-events:none}
.gss-pattern-option-copy{padding:27px}
.gss-pattern-option-copy>span{color:var(--pattern-orange);font:800 10px/1.2 Manrope,sans-serif;letter-spacing:.1em}
.gss-pattern-option-copy h3{margin:13px 0 10px;font-size:23px}
.gss-pattern-option-copy p{margin:0;color:#5d6f7a;font-size:14px;line-height:1.7}
.gss-pattern-concept-note{margin:20px 0 0;color:#687985;font-size:13px;font-style:italic}

.gss-pattern-artwork{padding:clamp(72px,8vw,100px) 0!important;background:var(--pattern-soft)}
.gss-pattern-artwork-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(520px,1.18fr);gap:clamp(50px,8vw,100px);align-items:start}
.gss-pattern-artwork-copy h2{margin:12px 0 18px!important;font-size:clamp(2.2rem,4vw,3.7rem);line-height:1.05}
.gss-pattern-artwork-copy>p:not(.gss-proto-kicker){color:#5b6d78}
.gss-pattern-file-spec{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid #cad7de;border-left:1px solid #cad7de}
.gss-pattern-file-spec div{min-height:138px;padding:24px;border-right:1px solid #cad7de;border-bottom:1px solid #cad7de;background:#fff}
.gss-pattern-file-spec strong{display:block;margin-bottom:10px;color:var(--pattern-ink);font-size:13px}
.gss-pattern-file-spec span{color:#60727d;font-size:13px;line-height:1.55}

.gss-pattern-sample{padding:clamp(72px,8vw,104px) 0!important}
.gss-pattern-sample-grid{display:grid;grid-template-columns:minmax(440px,1.08fr) minmax(0,.92fr);gap:42px;align-items:stretch}
.gss-pattern-sample-media{position:relative;margin:0;min-height:590px;overflow:hidden;background:var(--pattern-soft)}
.gss-pattern-sample-media>img{width:100%;height:100%;min-height:590px;object-fit:cover;filter:saturate(.7)}
.gss-pattern-sample-media:after{position:absolute;inset:0;background:linear-gradient(180deg,transparent 68%,rgba(8,29,46,.82));content:""}
.gss-pattern-sample-media figcaption{position:absolute;z-index:3;right:18px;bottom:15px;color:#fff;font-size:9px}
.gss-pattern-review-list{border-top:1px solid var(--pattern-line)}
.gss-pattern-review-list article{display:grid;grid-template-columns:42px 1fr;gap:17px;padding:24px 6px;border-bottom:1px solid var(--pattern-line)}
.gss-pattern-review-list article>span{color:var(--pattern-orange);font:800 11px/1.2 Manrope,sans-serif}
.gss-pattern-review-list h3{margin:0 0 6px;font-size:19px}
.gss-pattern-review-list p{margin:0;color:#60727d;font-size:13px;line-height:1.6}
.gss-pattern-performance-note{margin-top:30px;padding:22px 26px;border-left:4px solid var(--pattern-orange);background:#fff5ef}
.gss-pattern-performance-note p{margin:0;color:#4e626f;font-size:14px}
.gss-pattern-final{padding:64px 0!important;background:#fff!important;color:var(--pattern-ink)!important;border-top:1px solid var(--pattern-line)}
.gss-pattern-final h2{margin:10px 0 0!important;color:var(--pattern-ink)!important}
.gss-pattern-final p{color:#5d6f7a!important}

@media(max-width:1050px){
 .gss-pattern-hero-grid,.gss-pattern-artwork-grid,.gss-pattern-sample-grid{grid-template-columns:1fr}
 .gss-pattern-hero-media{min-height:500px}
 .gss-pattern-option-grid{grid-template-columns:1fr}
 .gss-pattern-option-grid article{display:grid;grid-template-columns:minmax(320px,.9fr) 1.1fr}
 .gss-pattern-option-grid figure{height:320px}
 .gss-pattern-sample-media,.gss-pattern-sample-media>img{min-height:480px}
}
@media(max-width:680px){
 .gss-pattern-hero{padding:58px 0}
 .gss-pattern-hero-media{min-height:430px}
 .gss-grip-sole-diagram.is-hero{height:370px}
 .gss-pattern-option-grid article{display:block}
 .gss-pattern-option-grid figure{height:300px}
 .gss-grip-sole-diagram{width:154px;height:276px}
 .gss-pattern-file-spec{grid-template-columns:1fr}
 .gss-pattern-file-spec div{min-height:0}
 .gss-pattern-sample-media,.gss-pattern-sample-media>img{min-height:390px}
}
