/* ========================================================================== Islamifiq · site stylesheet 1. State and utility classes (former inline styles, JS state) 2. Base system (tokens, type, components) 3. Page styles, scoped with :where(.isq-page--name) so specificity is unchanged 4. Responsive layer 5. Cookie consent ========================================================================== */ /* ============ 1. state and utility classes ============ */ /* Former inline styles. :where() keeps specificity at zero and !important reproduces inline precedence, so any !important rule below still wins exactly as before. */ :where(.isq-svg-defs){position:absolute !important;} :where(.isq-hero-eyebrow){margin-bottom:20px !important;justify-content:center !important;} :where(.isq-hero-actions){display:flex !important;gap:16px !important;flex-wrap:wrap !important;justify-content:center !important;margin-top:30px !important;} :where(.isq-section-title){margin-top:14px !important;} :where(.isq-section-title--single-line){max-width:none !important;white-space:nowrap !important;} :where(.isq-section-head--center){text-align:center !important;} :where(.isq-faq--center){margin:0 auto !important;} :where(.isq-cta-title){margin-top:16px !important;color:var(--black) !important;} :where(.isq-social-icon--filled){fill:currentColor !important;stroke:none !important;width:15px !important;height:15px !important;} :where(.isq-page-hero-eyebrow){color:var(--brass-bright) !important;margin-bottom:20px !important;justify-content:center !important;} :where(.isq-page-hero-title){color:#F1F1F1 !important;} :where(.isq-journal-section--flush-top){padding-top:0 !important;} :where(.isq-journal-swatch--pink){background:linear-gradient(135deg,#E4BBB6,#CF938C) !important;} :where(.isq-journal-swatch--cream){background:linear-gradient(135deg,#F7F7F7,#F1F1F1) !important;border:1px solid #CFCFCF !important;} :where(.isq-journal-swatch--black){background:linear-gradient(135deg,#2A2A2A,#111111) !important;} :where(.isq-journal-lead--narrow){max-width:40ch !important;} :where(.isq-about-eyebrow){margin-bottom:22px !important;} :where(.isq-about-title--narrow){max-width:18ch !important;} :where(.isq-about-cta-button){margin-top:10px !important;} :where(.isq-about-cta-title){margin-top:16px !important;} :where(.isq-track-error-link){color:#8E4130 !important;text-decoration:underline !important;} :where(.isq-checkout-label-note){text-transform:none !important;letter-spacing:0 !important;color:var(--greige-500) !important;} :where(.isq-checkout-fineprint){font-size:13px !important;color:var(--greige-500) !important;margin-top:20px !important;line-height:1.65 !important;} :where(.isq-checkout-link){color:var(--ink) !important;border-bottom:1px solid var(--brass) !important;} :where(.isq-checkout-summary-empty){font-size:14px !important;color:var(--ink-soft) !important;} :where(.isq-checkout-summary-value){max-width:60% !important;text-align:right !important;} :where(.isq-account-done){text-align:center !important;padding:16px 0 !important;} :where(.isq-account-done-text){font-size:15px !important;color:var(--ink) !important;} :where(.isq-cart-empty-button){width:100% !important;justify-content:center !important;} :where(.isq-search-submit){cursor:pointer !important;} /* State classes toggled by js/main.js */ :where(.isq-is-hidden){display:none !important;} :where(.isq-is-shown){display:block !important;} :where(.isq-scroll-lock){overflow:hidden !important;} :where(.isq-zoom-origin){transform-origin:var(--isq-zoom-x,50%) var(--isq-zoom-y,50%) !important;} /* Lightbox zoom origin, 5% steps */ .isq-zoom-x-0{--isq-zoom-x:0%;}.isq-zoom-y-0{--isq-zoom-y:0%;} .isq-zoom-x-5{--isq-zoom-x:5%;}.isq-zoom-y-5{--isq-zoom-y:5%;} .isq-zoom-x-10{--isq-zoom-x:10%;}.isq-zoom-y-10{--isq-zoom-y:10%;} .isq-zoom-x-15{--isq-zoom-x:15%;}.isq-zoom-y-15{--isq-zoom-y:15%;} .isq-zoom-x-20{--isq-zoom-x:20%;}.isq-zoom-y-20{--isq-zoom-y:20%;} .isq-zoom-x-25{--isq-zoom-x:25%;}.isq-zoom-y-25{--isq-zoom-y:25%;} .isq-zoom-x-30{--isq-zoom-x:30%;}.isq-zoom-y-30{--isq-zoom-y:30%;} .isq-zoom-x-35{--isq-zoom-x:35%;}.isq-zoom-y-35{--isq-zoom-y:35%;} .isq-zoom-x-40{--isq-zoom-x:40%;}.isq-zoom-y-40{--isq-zoom-y:40%;} .isq-zoom-x-45{--isq-zoom-x:45%;}.isq-zoom-y-45{--isq-zoom-y:45%;} .isq-zoom-x-50{--isq-zoom-x:50%;}.isq-zoom-y-50{--isq-zoom-y:50%;} .isq-zoom-x-55{--isq-zoom-x:55%;}.isq-zoom-y-55{--isq-zoom-y:55%;} .isq-zoom-x-60{--isq-zoom-x:60%;}.isq-zoom-y-60{--isq-zoom-y:60%;} .isq-zoom-x-65{--isq-zoom-x:65%;}.isq-zoom-y-65{--isq-zoom-y:65%;} .isq-zoom-x-70{--isq-zoom-x:70%;}.isq-zoom-y-70{--isq-zoom-y:70%;} .isq-zoom-x-75{--isq-zoom-x:75%;}.isq-zoom-y-75{--isq-zoom-y:75%;} .isq-zoom-x-80{--isq-zoom-x:80%;}.isq-zoom-y-80{--isq-zoom-y:80%;} .isq-zoom-x-85{--isq-zoom-x:85%;}.isq-zoom-y-85{--isq-zoom-y:85%;} .isq-zoom-x-90{--isq-zoom-x:90%;}.isq-zoom-y-90{--isq-zoom-y:90%;} .isq-zoom-x-95{--isq-zoom-x:95%;}.isq-zoom-y-95{--isq-zoom-y:95%;} .isq-zoom-x-100{--isq-zoom-x:100%;}.isq-zoom-y-100{--isq-zoom-y:100%;} /* Staggered reveal delays, 70ms per item */ :where(.isq-stagger-0){transition-delay:0ms !important;} :where(.isq-stagger-1){transition-delay:70ms !important;} :where(.isq-stagger-2){transition-delay:140ms !important;} :where(.isq-stagger-3){transition-delay:210ms !important;} :where(.isq-stagger-4){transition-delay:280ms !important;} :where(.isq-stagger-5){transition-delay:350ms !important;} :where(.isq-stagger-6){transition-delay:420ms !important;} :where(.isq-stagger-7){transition-delay:490ms !important;} :where(.isq-stagger-8){transition-delay:560ms !important;} :where(.isq-stagger-9){transition-delay:630ms !important;} :where(.isq-stagger-10){transition-delay:700ms !important;} :where(.isq-stagger-11){transition-delay:770ms !important;} :where(.isq-stagger-12){transition-delay:840ms !important;} :where(.isq-stagger-13){transition-delay:910ms !important;} :where(.isq-stagger-14){transition-delay:980ms !important;} :where(.isq-stagger-15){transition-delay:1050ms !important;} :where(.isq-stagger-16){transition-delay:1120ms !important;} :where(.isq-stagger-17){transition-delay:1190ms !important;} :where(.isq-stagger-18){transition-delay:1260ms !important;} :where(.isq-stagger-19){transition-delay:1330ms !important;} :where(.isq-stagger-20){transition-delay:1400ms !important;} :where(.isq-stagger-21){transition-delay:1470ms !important;} :where(.isq-stagger-22){transition-delay:1540ms !important;} :where(.isq-stagger-23){transition-delay:1610ms !important;} :where(.isq-stagger-24){transition-delay:1680ms !important;} :where(.isq-stagger-25){transition-delay:1750ms !important;} :where(.isq-stagger-26){transition-delay:1820ms !important;} :where(.isq-stagger-27){transition-delay:1890ms !important;} :where(.isq-stagger-28){transition-delay:1960ms !important;} :where(.isq-stagger-29){transition-delay:2030ms !important;} :where(.isq-stagger-30){transition-delay:2100ms !important;} :where(.isq-stagger-31){transition-delay:2170ms !important;} :where(.isq-stagger-32){transition-delay:2240ms !important;} :where(.isq-stagger-33){transition-delay:2310ms !important;} :where(.isq-stagger-34){transition-delay:2380ms !important;} :where(.isq-stagger-35){transition-delay:2450ms !important;} :where(.isq-stagger-36){transition-delay:2520ms !important;} :where(.isq-stagger-37){transition-delay:2590ms !important;} :where(.isq-stagger-38){transition-delay:2660ms !important;} :where(.isq-stagger-39){transition-delay:2730ms !important;} :where(.isq-stagger-40){transition-delay:2800ms !important;} /* Scroll progress bar, 0.5% steps */ :where(.scroll-prog.isq-progress-0){transform:scaleX(0) !important;} :where(.scroll-prog.isq-progress-1){transform:scaleX(0.005) !important;} :where(.scroll-prog.isq-progress-2){transform:scaleX(0.01) !important;} :where(.scroll-prog.isq-progress-3){transform:scaleX(0.015) !important;} :where(.scroll-prog.isq-progress-4){transform:scaleX(0.02) !important;} :where(.scroll-prog.isq-progress-5){transform:scaleX(0.025) !important;} :where(.scroll-prog.isq-progress-6){transform:scaleX(0.03) !important;} :where(.scroll-prog.isq-progress-7){transform:scaleX(0.035) !important;} :where(.scroll-prog.isq-progress-8){transform:scaleX(0.04) !important;} :where(.scroll-prog.isq-progress-9){transform:scaleX(0.045) !important;} :where(.scroll-prog.isq-progress-10){transform:scaleX(0.05) !important;} :where(.scroll-prog.isq-progress-11){transform:scaleX(0.055) !important;} :where(.scroll-prog.isq-progress-12){transform:scaleX(0.06) !important;} :where(.scroll-prog.isq-progress-13){transform:scaleX(0.065) !important;} :where(.scroll-prog.isq-progress-14){transform:scaleX(0.07) !important;} :where(.scroll-prog.isq-progress-15){transform:scaleX(0.075) !important;} :where(.scroll-prog.isq-progress-16){transform:scaleX(0.08) !important;} :where(.scroll-prog.isq-progress-17){transform:scaleX(0.085) !important;} :where(.scroll-prog.isq-progress-18){transform:scaleX(0.09) !important;} :where(.scroll-prog.isq-progress-19){transform:scaleX(0.095) !important;} :where(.scroll-prog.isq-progress-20){transform:scaleX(0.1) !important;} :where(.scroll-prog.isq-progress-21){transform:scaleX(0.105) !important;} :where(.scroll-prog.isq-progress-22){transform:scaleX(0.11) !important;} :where(.scroll-prog.isq-progress-23){transform:scaleX(0.115) !important;} :where(.scroll-prog.isq-progress-24){transform:scaleX(0.12) !important;} :where(.scroll-prog.isq-progress-25){transform:scaleX(0.125) !important;} :where(.scroll-prog.isq-progress-26){transform:scaleX(0.13) !important;} :where(.scroll-prog.isq-progress-27){transform:scaleX(0.135) !important;} :where(.scroll-prog.isq-progress-28){transform:scaleX(0.14) !important;} :where(.scroll-prog.isq-progress-29){transform:scaleX(0.145) !important;} :where(.scroll-prog.isq-progress-30){transform:scaleX(0.15) !important;} :where(.scroll-prog.isq-progress-31){transform:scaleX(0.155) !important;} :where(.scroll-prog.isq-progress-32){transform:scaleX(0.16) !important;} :where(.scroll-prog.isq-progress-33){transform:scaleX(0.165) !important;} :where(.scroll-prog.isq-progress-34){transform:scaleX(0.17) !important;} :where(.scroll-prog.isq-progress-35){transform:scaleX(0.175) !important;} :where(.scroll-prog.isq-progress-36){transform:scaleX(0.18) !important;} :where(.scroll-prog.isq-progress-37){transform:scaleX(0.185) !important;} :where(.scroll-prog.isq-progress-38){transform:scaleX(0.19) !important;} :where(.scroll-prog.isq-progress-39){transform:scaleX(0.195) !important;} :where(.scroll-prog.isq-progress-40){transform:scaleX(0.2) !important;} :where(.scroll-prog.isq-progress-41){transform:scaleX(0.205) !important;} :where(.scroll-prog.isq-progress-42){transform:scaleX(0.21) !important;} :where(.scroll-prog.isq-progress-43){transform:scaleX(0.215) !important;} :where(.scroll-prog.isq-progress-44){transform:scaleX(0.22) !important;} :where(.scroll-prog.isq-progress-45){transform:scaleX(0.225) !important;} :where(.scroll-prog.isq-progress-46){transform:scaleX(0.23) !important;} :where(.scroll-prog.isq-progress-47){transform:scaleX(0.235) !important;} :where(.scroll-prog.isq-progress-48){transform:scaleX(0.24) !important;} :where(.scroll-prog.isq-progress-49){transform:scaleX(0.245) !important;} :where(.scroll-prog.isq-progress-50){transform:scaleX(0.25) !important;} :where(.scroll-prog.isq-progress-51){transform:scaleX(0.255) !important;} :where(.scroll-prog.isq-progress-52){transform:scaleX(0.26) !important;} :where(.scroll-prog.isq-progress-53){transform:scaleX(0.265) !important;} :where(.scroll-prog.isq-progress-54){transform:scaleX(0.27) !important;} :where(.scroll-prog.isq-progress-55){transform:scaleX(0.275) !important;} :where(.scroll-prog.isq-progress-56){transform:scaleX(0.28) !important;} :where(.scroll-prog.isq-progress-57){transform:scaleX(0.285) !important;} :where(.scroll-prog.isq-progress-58){transform:scaleX(0.29) !important;} :where(.scroll-prog.isq-progress-59){transform:scaleX(0.295) !important;} :where(.scroll-prog.isq-progress-60){transform:scaleX(0.3) !important;} :where(.scroll-prog.isq-progress-61){transform:scaleX(0.305) !important;} :where(.scroll-prog.isq-progress-62){transform:scaleX(0.31) !important;} :where(.scroll-prog.isq-progress-63){transform:scaleX(0.315) !important;} :where(.scroll-prog.isq-progress-64){transform:scaleX(0.32) !important;} :where(.scroll-prog.isq-progress-65){transform:scaleX(0.325) !important;} :where(.scroll-prog.isq-progress-66){transform:scaleX(0.33) !important;} :where(.scroll-prog.isq-progress-67){transform:scaleX(0.335) !important;} :where(.scroll-prog.isq-progress-68){transform:scaleX(0.34) !important;} :where(.scroll-prog.isq-progress-69){transform:scaleX(0.345) !important;} :where(.scroll-prog.isq-progress-70){transform:scaleX(0.35) !important;} :where(.scroll-prog.isq-progress-71){transform:scaleX(0.355) !important;} :where(.scroll-prog.isq-progress-72){transform:scaleX(0.36) !important;} :where(.scroll-prog.isq-progress-73){transform:scaleX(0.365) !important;} :where(.scroll-prog.isq-progress-74){transform:scaleX(0.37) !important;} :where(.scroll-prog.isq-progress-75){transform:scaleX(0.375) !important;} :where(.scroll-prog.isq-progress-76){transform:scaleX(0.38) !important;} :where(.scroll-prog.isq-progress-77){transform:scaleX(0.385) !important;} :where(.scroll-prog.isq-progress-78){transform:scaleX(0.39) !important;} :where(.scroll-prog.isq-progress-79){transform:scaleX(0.395) !important;} :where(.scroll-prog.isq-progress-80){transform:scaleX(0.4) !important;} :where(.scroll-prog.isq-progress-81){transform:scaleX(0.405) !important;} :where(.scroll-prog.isq-progress-82){transform:scaleX(0.41) !important;} :where(.scroll-prog.isq-progress-83){transform:scaleX(0.415) !important;} :where(.scroll-prog.isq-progress-84){transform:scaleX(0.42) !important;} :where(.scroll-prog.isq-progress-85){transform:scaleX(0.425) !important;} :where(.scroll-prog.isq-progress-86){transform:scaleX(0.43) !important;} :where(.scroll-prog.isq-progress-87){transform:scaleX(0.435) !important;} :where(.scroll-prog.isq-progress-88){transform:scaleX(0.44) !important;} :where(.scroll-prog.isq-progress-89){transform:scaleX(0.445) !important;} :where(.scroll-prog.isq-progress-90){transform:scaleX(0.45) !important;} :where(.scroll-prog.isq-progress-91){transform:scaleX(0.455) !important;} :where(.scroll-prog.isq-progress-92){transform:scaleX(0.46) !important;} :where(.scroll-prog.isq-progress-93){transform:scaleX(0.465) !important;} :where(.scroll-prog.isq-progress-94){transform:scaleX(0.47) !important;} :where(.scroll-prog.isq-progress-95){transform:scaleX(0.475) !important;} :where(.scroll-prog.isq-progress-96){transform:scaleX(0.48) !important;} :where(.scroll-prog.isq-progress-97){transform:scaleX(0.485) !important;} :where(.scroll-prog.isq-progress-98){transform:scaleX(0.49) !important;} :where(.scroll-prog.isq-progress-99){transform:scaleX(0.495) !important;} :where(.scroll-prog.isq-progress-100){transform:scaleX(0.5) !important;} :where(.scroll-prog.isq-progress-101){transform:scaleX(0.505) !important;} :where(.scroll-prog.isq-progress-102){transform:scaleX(0.51) !important;} :where(.scroll-prog.isq-progress-103){transform:scaleX(0.515) !important;} :where(.scroll-prog.isq-progress-104){transform:scaleX(0.52) !important;} :where(.scroll-prog.isq-progress-105){transform:scaleX(0.525) !important;} :where(.scroll-prog.isq-progress-106){transform:scaleX(0.53) !important;} :where(.scroll-prog.isq-progress-107){transform:scaleX(0.535) !important;} :where(.scroll-prog.isq-progress-108){transform:scaleX(0.54) !important;} :where(.scroll-prog.isq-progress-109){transform:scaleX(0.545) !important;} :where(.scroll-prog.isq-progress-110){transform:scaleX(0.55) !important;} :where(.scroll-prog.isq-progress-111){transform:scaleX(0.555) !important;} :where(.scroll-prog.isq-progress-112){transform:scaleX(0.56) !important;} :where(.scroll-prog.isq-progress-113){transform:scaleX(0.565) !important;} :where(.scroll-prog.isq-progress-114){transform:scaleX(0.57) !important;} :where(.scroll-prog.isq-progress-115){transform:scaleX(0.575) !important;} :where(.scroll-prog.isq-progress-116){transform:scaleX(0.58) !important;} :where(.scroll-prog.isq-progress-117){transform:scaleX(0.585) !important;} :where(.scroll-prog.isq-progress-118){transform:scaleX(0.59) !important;} :where(.scroll-prog.isq-progress-119){transform:scaleX(0.595) !important;} :where(.scroll-prog.isq-progress-120){transform:scaleX(0.6) !important;} :where(.scroll-prog.isq-progress-121){transform:scaleX(0.605) !important;} :where(.scroll-prog.isq-progress-122){transform:scaleX(0.61) !important;} :where(.scroll-prog.isq-progress-123){transform:scaleX(0.615) !important;} :where(.scroll-prog.isq-progress-124){transform:scaleX(0.62) !important;} :where(.scroll-prog.isq-progress-125){transform:scaleX(0.625) !important;} :where(.scroll-prog.isq-progress-126){transform:scaleX(0.63) !important;} :where(.scroll-prog.isq-progress-127){transform:scaleX(0.635) !important;} :where(.scroll-prog.isq-progress-128){transform:scaleX(0.64) !important;} :where(.scroll-prog.isq-progress-129){transform:scaleX(0.645) !important;} :where(.scroll-prog.isq-progress-130){transform:scaleX(0.65) !important;} :where(.scroll-prog.isq-progress-131){transform:scaleX(0.655) !important;} :where(.scroll-prog.isq-progress-132){transform:scaleX(0.66) !important;} :where(.scroll-prog.isq-progress-133){transform:scaleX(0.665) !important;} :where(.scroll-prog.isq-progress-134){transform:scaleX(0.67) !important;} :where(.scroll-prog.isq-progress-135){transform:scaleX(0.675) !important;} :where(.scroll-prog.isq-progress-136){transform:scaleX(0.68) !important;} :where(.scroll-prog.isq-progress-137){transform:scaleX(0.685) !important;} :where(.scroll-prog.isq-progress-138){transform:scaleX(0.69) !important;} :where(.scroll-prog.isq-progress-139){transform:scaleX(0.695) !important;} :where(.scroll-prog.isq-progress-140){transform:scaleX(0.7) !important;} :where(.scroll-prog.isq-progress-141){transform:scaleX(0.705) !important;} :where(.scroll-prog.isq-progress-142){transform:scaleX(0.71) !important;} :where(.scroll-prog.isq-progress-143){transform:scaleX(0.715) !important;} :where(.scroll-prog.isq-progress-144){transform:scaleX(0.72) !important;} :where(.scroll-prog.isq-progress-145){transform:scaleX(0.725) !important;} :where(.scroll-prog.isq-progress-146){transform:scaleX(0.73) !important;} :where(.scroll-prog.isq-progress-147){transform:scaleX(0.735) !important;} :where(.scroll-prog.isq-progress-148){transform:scaleX(0.74) !important;} :where(.scroll-prog.isq-progress-149){transform:scaleX(0.745) !important;} :where(.scroll-prog.isq-progress-150){transform:scaleX(0.75) !important;} :where(.scroll-prog.isq-progress-151){transform:scaleX(0.755) !important;} :where(.scroll-prog.isq-progress-152){transform:scaleX(0.76) !important;} :where(.scroll-prog.isq-progress-153){transform:scaleX(0.765) !important;} :where(.scroll-prog.isq-progress-154){transform:scaleX(0.77) !important;} :where(.scroll-prog.isq-progress-155){transform:scaleX(0.775) !important;} :where(.scroll-prog.isq-progress-156){transform:scaleX(0.78) !important;} :where(.scroll-prog.isq-progress-157){transform:scaleX(0.785) !important;} :where(.scroll-prog.isq-progress-158){transform:scaleX(0.79) !important;} :where(.scroll-prog.isq-progress-159){transform:scaleX(0.795) !important;} :where(.scroll-prog.isq-progress-160){transform:scaleX(0.8) !important;} :where(.scroll-prog.isq-progress-161){transform:scaleX(0.805) !important;} :where(.scroll-prog.isq-progress-162){transform:scaleX(0.81) !important;} :where(.scroll-prog.isq-progress-163){transform:scaleX(0.815) !important;} :where(.scroll-prog.isq-progress-164){transform:scaleX(0.82) !important;} :where(.scroll-prog.isq-progress-165){transform:scaleX(0.825) !important;} :where(.scroll-prog.isq-progress-166){transform:scaleX(0.83) !important;} :where(.scroll-prog.isq-progress-167){transform:scaleX(0.835) !important;} :where(.scroll-prog.isq-progress-168){transform:scaleX(0.84) !important;} :where(.scroll-prog.isq-progress-169){transform:scaleX(0.845) !important;} :where(.scroll-prog.isq-progress-170){transform:scaleX(0.85) !important;} :where(.scroll-prog.isq-progress-171){transform:scaleX(0.855) !important;} :where(.scroll-prog.isq-progress-172){transform:scaleX(0.86) !important;} :where(.scroll-prog.isq-progress-173){transform:scaleX(0.865) !important;} :where(.scroll-prog.isq-progress-174){transform:scaleX(0.87) !important;} :where(.scroll-prog.isq-progress-175){transform:scaleX(0.875) !important;} :where(.scroll-prog.isq-progress-176){transform:scaleX(0.88) !important;} :where(.scroll-prog.isq-progress-177){transform:scaleX(0.885) !important;} :where(.scroll-prog.isq-progress-178){transform:scaleX(0.89) !important;} :where(.scroll-prog.isq-progress-179){transform:scaleX(0.895) !important;} :where(.scroll-prog.isq-progress-180){transform:scaleX(0.9) !important;} :where(.scroll-prog.isq-progress-181){transform:scaleX(0.905) !important;} :where(.scroll-prog.isq-progress-182){transform:scaleX(0.91) !important;} :where(.scroll-prog.isq-progress-183){transform:scaleX(0.915) !important;} :where(.scroll-prog.isq-progress-184){transform:scaleX(0.92) !important;} :where(.scroll-prog.isq-progress-185){transform:scaleX(0.925) !important;} :where(.scroll-prog.isq-progress-186){transform:scaleX(0.93) !important;} :where(.scroll-prog.isq-progress-187){transform:scaleX(0.935) !important;} :where(.scroll-prog.isq-progress-188){transform:scaleX(0.94) !important;} :where(.scroll-prog.isq-progress-189){transform:scaleX(0.945) !important;} :where(.scroll-prog.isq-progress-190){transform:scaleX(0.95) !important;} :where(.scroll-prog.isq-progress-191){transform:scaleX(0.955) !important;} :where(.scroll-prog.isq-progress-192){transform:scaleX(0.96) !important;} :where(.scroll-prog.isq-progress-193){transform:scaleX(0.965) !important;} :where(.scroll-prog.isq-progress-194){transform:scaleX(0.97) !important;} :where(.scroll-prog.isq-progress-195){transform:scaleX(0.975) !important;} :where(.scroll-prog.isq-progress-196){transform:scaleX(0.98) !important;} :where(.scroll-prog.isq-progress-197){transform:scaleX(0.985) !important;} :where(.scroll-prog.isq-progress-198){transform:scaleX(0.99) !important;} :where(.scroll-prog.isq-progress-199){transform:scaleX(0.995) !important;} :where(.scroll-prog.isq-progress-200){transform:scaleX(1) !important;} /* Desktop canvas fit: mouse windows under 1180px scale the desktop layout (2px steps) */ @media (pointer:fine) and (max-width:1179.98px){:where(html){zoom:.5 !important;}} @media (pointer:fine) and (min-width:592px) and (max-width:1179.98px){:where(html){zoom:0.501695 !important;}} @media (pointer:fine) and (min-width:594px) and (max-width:1179.98px){:where(html){zoom:0.50339 !important;}} @media (pointer:fine) and (min-width:596px) and (max-width:1179.98px){:where(html){zoom:0.505085 !important;}} @media (pointer:fine) and (min-width:598px) and (max-width:1179.98px){:where(html){zoom:0.50678 !important;}} @media (pointer:fine) and (min-width:600px) and (max-width:1179.98px){:where(html){zoom:0.508475 !important;}} @media (pointer:fine) and (min-width:602px) and (max-width:1179.98px){:where(html){zoom:0.510169 !important;}} @media (pointer:fine) and (min-width:604px) and (max-width:1179.98px){:where(html){zoom:0.511864 !important;}} @media (pointer:fine) and (min-width:606px) and (max-width:1179.98px){:where(html){zoom:0.513559 !important;}} @media (pointer:fine) and (min-width:608px) and (max-width:1179.98px){:where(html){zoom:0.515254 !important;}} @media (pointer:fine) and (min-width:610px) and (max-width:1179.98px){:where(html){zoom:0.516949 !important;}} @media (pointer:fine) and (min-width:612px) and (max-width:1179.98px){:where(html){zoom:0.518644 !important;}} @media (pointer:fine) and (min-width:614px) and (max-width:1179.98px){:where(html){zoom:0.520339 !important;}} @media (pointer:fine) and (min-width:616px) and (max-width:1179.98px){:where(html){zoom:0.522034 !important;}} @media (pointer:fine) and (min-width:618px) and (max-width:1179.98px){:where(html){zoom:0.523729 !important;}} @media (pointer:fine) and (min-width:620px) and (max-width:1179.98px){:where(html){zoom:0.525424 !important;}} @media (pointer:fine) and (min-width:622px) and (max-width:1179.98px){:where(html){zoom:0.527119 !important;}} @media (pointer:fine) and (min-width:624px) and (max-width:1179.98px){:where(html){zoom:0.528814 !important;}} @media (pointer:fine) and (min-width:626px) and (max-width:1179.98px){:where(html){zoom:0.530508 !important;}} @media (pointer:fine) and (min-width:628px) and (max-width:1179.98px){:where(html){zoom:0.532203 !important;}} @media (pointer:fine) and (min-width:630px) and (max-width:1179.98px){:where(html){zoom:0.533898 !important;}} @media (pointer:fine) and (min-width:632px) and (max-width:1179.98px){:where(html){zoom:0.535593 !important;}} @media (pointer:fine) and (min-width:634px) and (max-width:1179.98px){:where(html){zoom:0.537288 !important;}} @media (pointer:fine) and (min-width:636px) and (max-width:1179.98px){:where(html){zoom:0.538983 !important;}} @media (pointer:fine) and (min-width:638px) and (max-width:1179.98px){:where(html){zoom:0.540678 !important;}} @media (pointer:fine) and (min-width:640px) and (max-width:1179.98px){:where(html){zoom:0.542373 !important;}} @media (pointer:fine) and (min-width:642px) and (max-width:1179.98px){:where(html){zoom:0.544068 !important;}} @media (pointer:fine) and (min-width:644px) and (max-width:1179.98px){:where(html){zoom:0.545763 !important;}} @media (pointer:fine) and (min-width:646px) and (max-width:1179.98px){:where(html){zoom:0.547458 !important;}} @media (pointer:fine) and (min-width:648px) and (max-width:1179.98px){:where(html){zoom:0.549153 !important;}} @media (pointer:fine) and (min-width:650px) and (max-width:1179.98px){:where(html){zoom:0.550847 !important;}} @media (pointer:fine) and (min-width:652px) and (max-width:1179.98px){:where(html){zoom:0.552542 !important;}} @media (pointer:fine) and (min-width:654px) and (max-width:1179.98px){:where(html){zoom:0.554237 !important;}} @media (pointer:fine) and (min-width:656px) and (max-width:1179.98px){:where(html){zoom:0.555932 !important;}} @media (pointer:fine) and (min-width:658px) and (max-width:1179.98px){:where(html){zoom:0.557627 !important;}} @media (pointer:fine) and (min-width:660px) and (max-width:1179.98px){:where(html){zoom:0.559322 !important;}} @media (pointer:fine) and (min-width:662px) and (max-width:1179.98px){:where(html){zoom:0.561017 !important;}} @media (pointer:fine) and (min-width:664px) and (max-width:1179.98px){:where(html){zoom:0.562712 !important;}} @media (pointer:fine) and (min-width:666px) and (max-width:1179.98px){:where(html){zoom:0.564407 !important;}} @media (pointer:fine) and (min-width:668px) and (max-width:1179.98px){:where(html){zoom:0.566102 !important;}} @media (pointer:fine) and (min-width:670px) and (max-width:1179.98px){:where(html){zoom:0.567797 !important;}} @media (pointer:fine) and (min-width:672px) and (max-width:1179.98px){:where(html){zoom:0.569492 !important;}} @media (pointer:fine) and (min-width:674px) and (max-width:1179.98px){:where(html){zoom:0.571186 !important;}} @media (pointer:fine) and (min-width:676px) and (max-width:1179.98px){:where(html){zoom:0.572881 !important;}} @media (pointer:fine) and (min-width:678px) and (max-width:1179.98px){:where(html){zoom:0.574576 !important;}} @media (pointer:fine) and (min-width:680px) and (max-width:1179.98px){:where(html){zoom:0.576271 !important;}} @media (pointer:fine) and (min-width:682px) and (max-width:1179.98px){:where(html){zoom:0.577966 !important;}} @media (pointer:fine) and (min-width:684px) and (max-width:1179.98px){:where(html){zoom:0.579661 !important;}} @media (pointer:fine) and (min-width:686px) and (max-width:1179.98px){:where(html){zoom:0.581356 !important;}} @media (pointer:fine) and (min-width:688px) and (max-width:1179.98px){:where(html){zoom:0.583051 !important;}} @media (pointer:fine) and (min-width:690px) and (max-width:1179.98px){:where(html){zoom:0.584746 !important;}} @media (pointer:fine) and (min-width:692px) and (max-width:1179.98px){:where(html){zoom:0.586441 !important;}} @media (pointer:fine) and (min-width:694px) and (max-width:1179.98px){:where(html){zoom:0.588136 !important;}} @media (pointer:fine) and (min-width:696px) and (max-width:1179.98px){:where(html){zoom:0.589831 !important;}} @media (pointer:fine) and (min-width:698px) and (max-width:1179.98px){:where(html){zoom:0.591525 !important;}} @media (pointer:fine) and (min-width:700px) and (max-width:1179.98px){:where(html){zoom:0.59322 !important;}} @media (pointer:fine) and (min-width:702px) and (max-width:1179.98px){:where(html){zoom:0.594915 !important;}} @media (pointer:fine) and (min-width:704px) and (max-width:1179.98px){:where(html){zoom:0.59661 !important;}} @media (pointer:fine) and (min-width:706px) and (max-width:1179.98px){:where(html){zoom:0.598305 !important;}} @media (pointer:fine) and (min-width:708px) and (max-width:1179.98px){:where(html){zoom:0.6 !important;}} @media (pointer:fine) and (min-width:710px) and (max-width:1179.98px){:where(html){zoom:0.601695 !important;}} @media (pointer:fine) and (min-width:712px) and (max-width:1179.98px){:where(html){zoom:0.60339 !important;}} @media (pointer:fine) and (min-width:714px) and (max-width:1179.98px){:where(html){zoom:0.605085 !important;}} @media (pointer:fine) and (min-width:716px) and (max-width:1179.98px){:where(html){zoom:0.60678 !important;}} @media (pointer:fine) and (min-width:718px) and (max-width:1179.98px){:where(html){zoom:0.608475 !important;}} @media (pointer:fine) and (min-width:720px) and (max-width:1179.98px){:where(html){zoom:0.610169 !important;}} @media (pointer:fine) and (min-width:722px) and (max-width:1179.98px){:where(html){zoom:0.611864 !important;}} @media (pointer:fine) and (min-width:724px) and (max-width:1179.98px){:where(html){zoom:0.613559 !important;}} @media (pointer:fine) and (min-width:726px) and (max-width:1179.98px){:where(html){zoom:0.615254 !important;}} @media (pointer:fine) and (min-width:728px) and (max-width:1179.98px){:where(html){zoom:0.616949 !important;}} @media (pointer:fine) and (min-width:730px) and (max-width:1179.98px){:where(html){zoom:0.618644 !important;}} @media (pointer:fine) and (min-width:732px) and (max-width:1179.98px){:where(html){zoom:0.620339 !important;}} @media (pointer:fine) and (min-width:734px) and (max-width:1179.98px){:where(html){zoom:0.622034 !important;}} @media (pointer:fine) and (min-width:736px) and (max-width:1179.98px){:where(html){zoom:0.623729 !important;}} @media (pointer:fine) and (min-width:738px) and (max-width:1179.98px){:where(html){zoom:0.625424 !important;}} @media (pointer:fine) and (min-width:740px) and (max-width:1179.98px){:where(html){zoom:0.627119 !important;}} @media (pointer:fine) and (min-width:742px) and (max-width:1179.98px){:where(html){zoom:0.628814 !important;}} @media (pointer:fine) and (min-width:744px) and (max-width:1179.98px){:where(html){zoom:0.630508 !important;}} @media (pointer:fine) and (min-width:746px) and (max-width:1179.98px){:where(html){zoom:0.632203 !important;}} @media (pointer:fine) and (min-width:748px) and (max-width:1179.98px){:where(html){zoom:0.633898 !important;}} @media (pointer:fine) and (min-width:750px) and (max-width:1179.98px){:where(html){zoom:0.635593 !important;}} @media (pointer:fine) and (min-width:752px) and (max-width:1179.98px){:where(html){zoom:0.637288 !important;}} @media (pointer:fine) and (min-width:754px) and (max-width:1179.98px){:where(html){zoom:0.638983 !important;}} @media (pointer:fine) and (min-width:756px) and (max-width:1179.98px){:where(html){zoom:0.640678 !important;}} @media (pointer:fine) and (min-width:758px) and (max-width:1179.98px){:where(html){zoom:0.642373 !important;}} @media (pointer:fine) and (min-width:760px) and (max-width:1179.98px){:where(html){zoom:0.644068 !important;}} @media (pointer:fine) and (min-width:762px) and (max-width:1179.98px){:where(html){zoom:0.645763 !important;}} @media (pointer:fine) and (min-width:764px) and (max-width:1179.98px){:where(html){zoom:0.647458 !important;}} @media (pointer:fine) and (min-width:766px) and (max-width:1179.98px){:where(html){zoom:0.649153 !important;}} @media (pointer:fine) and (min-width:768px) and (max-width:1179.98px){:where(html){zoom:0.650847 !important;}} @media (pointer:fine) and (min-width:770px) and (max-width:1179.98px){:where(html){zoom:0.652542 !important;}} @media (pointer:fine) and (min-width:772px) and (max-width:1179.98px){:where(html){zoom:0.654237 !important;}} @media (pointer:fine) and (min-width:774px) and (max-width:1179.98px){:where(html){zoom:0.655932 !important;}} @media (pointer:fine) and (min-width:776px) and (max-width:1179.98px){:where(html){zoom:0.657627 !important;}} @media (pointer:fine) and (min-width:778px) and (max-width:1179.98px){:where(html){zoom:0.659322 !important;}} @media (pointer:fine) and (min-width:780px) and (max-width:1179.98px){:where(html){zoom:0.661017 !important;}} @media (pointer:fine) and (min-width:782px) and (max-width:1179.98px){:where(html){zoom:0.662712 !important;}} @media (pointer:fine) and (min-width:784px) and (max-width:1179.98px){:where(html){zoom:0.664407 !important;}} @media (pointer:fine) and (min-width:786px) and (max-width:1179.98px){:where(html){zoom:0.666102 !important;}} @media (pointer:fine) and (min-width:788px) and (max-width:1179.98px){:where(html){zoom:0.667797 !important;}} @media (pointer:fine) and (min-width:790px) and (max-width:1179.98px){:where(html){zoom:0.669492 !important;}} @media (pointer:fine) and (min-width:792px) and (max-width:1179.98px){:where(html){zoom:0.671186 !important;}} @media (pointer:fine) and (min-width:794px) and (max-width:1179.98px){:where(html){zoom:0.672881 !important;}} @media (pointer:fine) and (min-width:796px) and (max-width:1179.98px){:where(html){zoom:0.674576 !important;}} @media (pointer:fine) and (min-width:798px) and (max-width:1179.98px){:where(html){zoom:0.676271 !important;}} @media (pointer:fine) and (min-width:800px) and (max-width:1179.98px){:where(html){zoom:0.677966 !important;}} @media (pointer:fine) and (min-width:802px) and (max-width:1179.98px){:where(html){zoom:0.679661 !important;}} @media (pointer:fine) and (min-width:804px) and (max-width:1179.98px){:where(html){zoom:0.681356 !important;}} @media (pointer:fine) and (min-width:806px) and (max-width:1179.98px){:where(html){zoom:0.683051 !important;}} @media (pointer:fine) and (min-width:808px) and (max-width:1179.98px){:where(html){zoom:0.684746 !important;}} @media (pointer:fine) and (min-width:810px) and (max-width:1179.98px){:where(html){zoom:0.686441 !important;}} @media (pointer:fine) and (min-width:812px) and (max-width:1179.98px){:where(html){zoom:0.688136 !important;}} @media (pointer:fine) and (min-width:814px) and (max-width:1179.98px){:where(html){zoom:0.689831 !important;}} @media (pointer:fine) and (min-width:816px) and (max-width:1179.98px){:where(html){zoom:0.691525 !important;}} @media (pointer:fine) and (min-width:818px) and (max-width:1179.98px){:where(html){zoom:0.69322 !important;}} @media (pointer:fine) and (min-width:820px) and (max-width:1179.98px){:where(html){zoom:0.694915 !important;}} @media (pointer:fine) and (min-width:822px) and (max-width:1179.98px){:where(html){zoom:0.69661 !important;}} @media (pointer:fine) and (min-width:824px) and (max-width:1179.98px){:where(html){zoom:0.698305 !important;}} @media (pointer:fine) and (min-width:826px) and (max-width:1179.98px){:where(html){zoom:0.7 !important;}} @media (pointer:fine) and (min-width:828px) and (max-width:1179.98px){:where(html){zoom:0.701695 !important;}} @media (pointer:fine) and (min-width:830px) and (max-width:1179.98px){:where(html){zoom:0.70339 !important;}} @media (pointer:fine) and (min-width:832px) and (max-width:1179.98px){:where(html){zoom:0.705085 !important;}} @media (pointer:fine) and (min-width:834px) and (max-width:1179.98px){:where(html){zoom:0.70678 !important;}} @media (pointer:fine) and (min-width:836px) and (max-width:1179.98px){:where(html){zoom:0.708475 !important;}} @media (pointer:fine) and (min-width:838px) and (max-width:1179.98px){:where(html){zoom:0.710169 !important;}} @media (pointer:fine) and (min-width:840px) and (max-width:1179.98px){:where(html){zoom:0.711864 !important;}} @media (pointer:fine) and (min-width:842px) and (max-width:1179.98px){:where(html){zoom:0.713559 !important;}} @media (pointer:fine) and (min-width:844px) and (max-width:1179.98px){:where(html){zoom:0.715254 !important;}} @media (pointer:fine) and (min-width:846px) and (max-width:1179.98px){:where(html){zoom:0.716949 !important;}} @media (pointer:fine) and (min-width:848px) and (max-width:1179.98px){:where(html){zoom:0.718644 !important;}} @media (pointer:fine) and (min-width:850px) and (max-width:1179.98px){:where(html){zoom:0.720339 !important;}} @media (pointer:fine) and (min-width:852px) and (max-width:1179.98px){:where(html){zoom:0.722034 !important;}} @media (pointer:fine) and (min-width:854px) and (max-width:1179.98px){:where(html){zoom:0.723729 !important;}} @media (pointer:fine) and (min-width:856px) and (max-width:1179.98px){:where(html){zoom:0.725424 !important;}} @media (pointer:fine) and (min-width:858px) and (max-width:1179.98px){:where(html){zoom:0.727119 !important;}} @media (pointer:fine) and (min-width:860px) and (max-width:1179.98px){:where(html){zoom:0.728814 !important;}} @media (pointer:fine) and (min-width:862px) and (max-width:1179.98px){:where(html){zoom:0.730508 !important;}} @media (pointer:fine) and (min-width:864px) and (max-width:1179.98px){:where(html){zoom:0.732203 !important;}} @media (pointer:fine) and (min-width:866px) and (max-width:1179.98px){:where(html){zoom:0.733898 !important;}} @media (pointer:fine) and (min-width:868px) and (max-width:1179.98px){:where(html){zoom:0.735593 !important;}} @media (pointer:fine) and (min-width:870px) and (max-width:1179.98px){:where(html){zoom:0.737288 !important;}} @media (pointer:fine) and (min-width:872px) and (max-width:1179.98px){:where(html){zoom:0.738983 !important;}} @media (pointer:fine) and (min-width:874px) and (max-width:1179.98px){:where(html){zoom:0.740678 !important;}} @media (pointer:fine) and (min-width:876px) and (max-width:1179.98px){:where(html){zoom:0.742373 !important;}} @media (pointer:fine) and (min-width:878px) and (max-width:1179.98px){:where(html){zoom:0.744068 !important;}} @media (pointer:fine) and (min-width:880px) and (max-width:1179.98px){:where(html){zoom:0.745763 !important;}} @media (pointer:fine) and (min-width:882px) and (max-width:1179.98px){:where(html){zoom:0.747458 !important;}} @media (pointer:fine) and (min-width:884px) and (max-width:1179.98px){:where(html){zoom:0.749153 !important;}} @media (pointer:fine) and (min-width:886px) and (max-width:1179.98px){:where(html){zoom:0.750847 !important;}} @media (pointer:fine) and (min-width:888px) and (max-width:1179.98px){:where(html){zoom:0.752542 !important;}} @media (pointer:fine) and (min-width:890px) and (max-width:1179.98px){:where(html){zoom:0.754237 !important;}} @media (pointer:fine) and (min-width:892px) and (max-width:1179.98px){:where(html){zoom:0.755932 !important;}} @media (pointer:fine) and (min-width:894px) and (max-width:1179.98px){:where(html){zoom:0.757627 !important;}} @media (pointer:fine) and (min-width:896px) and (max-width:1179.98px){:where(html){zoom:0.759322 !important;}} @media (pointer:fine) and (min-width:898px) and (max-width:1179.98px){:where(html){zoom:0.761017 !important;}} @media (pointer:fine) and (min-width:900px) and (max-width:1179.98px){:where(html){zoom:0.762712 !important;}} @media (pointer:fine) and (min-width:902px) and (max-width:1179.98px){:where(html){zoom:0.764407 !important;}} @media (pointer:fine) and (min-width:904px) and (max-width:1179.98px){:where(html){zoom:0.766102 !important;}} @media (pointer:fine) and (min-width:906px) and (max-width:1179.98px){:where(html){zoom:0.767797 !important;}} @media (pointer:fine) and (min-width:908px) and (max-width:1179.98px){:where(html){zoom:0.769492 !important;}} @media (pointer:fine) and (min-width:910px) and (max-width:1179.98px){:where(html){zoom:0.771186 !important;}} @media (pointer:fine) and (min-width:912px) and (max-width:1179.98px){:where(html){zoom:0.772881 !important;}} @media (pointer:fine) and (min-width:914px) and (max-width:1179.98px){:where(html){zoom:0.774576 !important;}} @media (pointer:fine) and (min-width:916px) and (max-width:1179.98px){:where(html){zoom:0.776271 !important;}} @media (pointer:fine) and (min-width:918px) and (max-width:1179.98px){:where(html){zoom:0.777966 !important;}} @media (pointer:fine) and (min-width:920px) and (max-width:1179.98px){:where(html){zoom:0.779661 !important;}} @media (pointer:fine) and (min-width:922px) and (max-width:1179.98px){:where(html){zoom:0.781356 !important;}} @media (pointer:fine) and (min-width:924px) and (max-width:1179.98px){:where(html){zoom:0.783051 !important;}} @media (pointer:fine) and (min-width:926px) and (max-width:1179.98px){:where(html){zoom:0.784746 !important;}} @media (pointer:fine) and (min-width:928px) and (max-width:1179.98px){:where(html){zoom:0.786441 !important;}} @media (pointer:fine) and (min-width:930px) and (max-width:1179.98px){:where(html){zoom:0.788136 !important;}} @media (pointer:fine) and (min-width:932px) and (max-width:1179.98px){:where(html){zoom:0.789831 !important;}} @media (pointer:fine) and (min-width:934px) and (max-width:1179.98px){:where(html){zoom:0.791525 !important;}} @media (pointer:fine) and (min-width:936px) and (max-width:1179.98px){:where(html){zoom:0.79322 !important;}} @media (pointer:fine) and (min-width:938px) and (max-width:1179.98px){:where(html){zoom:0.794915 !important;}} @media (pointer:fine) and (min-width:940px) and (max-width:1179.98px){:where(html){zoom:0.79661 !important;}} @media (pointer:fine) and (min-width:942px) and (max-width:1179.98px){:where(html){zoom:0.798305 !important;}} @media (pointer:fine) and (min-width:944px) and (max-width:1179.98px){:where(html){zoom:0.8 !important;}} @media (pointer:fine) and (min-width:946px) and (max-width:1179.98px){:where(html){zoom:0.801695 !important;}} @media (pointer:fine) and (min-width:948px) and (max-width:1179.98px){:where(html){zoom:0.80339 !important;}} @media (pointer:fine) and (min-width:950px) and (max-width:1179.98px){:where(html){zoom:0.805085 !important;}} @media (pointer:fine) and (min-width:952px) and (max-width:1179.98px){:where(html){zoom:0.80678 !important;}} @media (pointer:fine) and (min-width:954px) and (max-width:1179.98px){:where(html){zoom:0.808475 !important;}} @media (pointer:fine) and (min-width:956px) and (max-width:1179.98px){:where(html){zoom:0.810169 !important;}} @media (pointer:fine) and (min-width:958px) and (max-width:1179.98px){:where(html){zoom:0.811864 !important;}} @media (pointer:fine) and (min-width:960px) and (max-width:1179.98px){:where(html){zoom:0.813559 !important;}} @media (pointer:fine) and (min-width:962px) and (max-width:1179.98px){:where(html){zoom:0.815254 !important;}} @media (pointer:fine) and (min-width:964px) and (max-width:1179.98px){:where(html){zoom:0.816949 !important;}} @media (pointer:fine) and (min-width:966px) and (max-width:1179.98px){:where(html){zoom:0.818644 !important;}} @media (pointer:fine) and (min-width:968px) and (max-width:1179.98px){:where(html){zoom:0.820339 !important;}} @media (pointer:fine) and (min-width:970px) and (max-width:1179.98px){:where(html){zoom:0.822034 !important;}} @media (pointer:fine) and (min-width:972px) and (max-width:1179.98px){:where(html){zoom:0.823729 !important;}} @media (pointer:fine) and (min-width:974px) and (max-width:1179.98px){:where(html){zoom:0.825424 !important;}} @media (pointer:fine) and (min-width:976px) and (max-width:1179.98px){:where(html){zoom:0.827119 !important;}} @media (pointer:fine) and (min-width:978px) and (max-width:1179.98px){:where(html){zoom:0.828814 !important;}} @media (pointer:fine) and (min-width:980px) and (max-width:1179.98px){:where(html){zoom:0.830508 !important;}} @media (pointer:fine) and (min-width:982px) and (max-width:1179.98px){:where(html){zoom:0.832203 !important;}} @media (pointer:fine) and (min-width:984px) and (max-width:1179.98px){:where(html){zoom:0.833898 !important;}} @media (pointer:fine) and (min-width:986px) and (max-width:1179.98px){:where(html){zoom:0.835593 !important;}} @media (pointer:fine) and (min-width:988px) and (max-width:1179.98px){:where(html){zoom:0.837288 !important;}} @media (pointer:fine) and (min-width:990px) and (max-width:1179.98px){:where(html){zoom:0.838983 !important;}} @media (pointer:fine) and (min-width:992px) and (max-width:1179.98px){:where(html){zoom:0.840678 !important;}} @media (pointer:fine) and (min-width:994px) and (max-width:1179.98px){:where(html){zoom:0.842373 !important;}} @media (pointer:fine) and (min-width:996px) and (max-width:1179.98px){:where(html){zoom:0.844068 !important;}} @media (pointer:fine) and (min-width:998px) and (max-width:1179.98px){:where(html){zoom:0.845763 !important;}} @media (pointer:fine) and (min-width:1000px) and (max-width:1179.98px){:where(html){zoom:0.847458 !important;}} @media (pointer:fine) and (min-width:1002px) and (max-width:1179.98px){:where(html){zoom:0.849153 !important;}} @media (pointer:fine) and (min-width:1004px) and (max-width:1179.98px){:where(html){zoom:0.850847 !important;}} @media (pointer:fine) and (min-width:1006px) and (max-width:1179.98px){:where(html){zoom:0.852542 !important;}} @media (pointer:fine) and (min-width:1008px) and (max-width:1179.98px){:where(html){zoom:0.854237 !important;}} @media (pointer:fine) and (min-width:1010px) and (max-width:1179.98px){:where(html){zoom:0.855932 !important;}} @media (pointer:fine) and (min-width:1012px) and (max-width:1179.98px){:where(html){zoom:0.857627 !important;}} @media (pointer:fine) and (min-width:1014px) and (max-width:1179.98px){:where(html){zoom:0.859322 !important;}} @media (pointer:fine) and (min-width:1016px) and (max-width:1179.98px){:where(html){zoom:0.861017 !important;}} @media (pointer:fine) and (min-width:1018px) and (max-width:1179.98px){:where(html){zoom:0.862712 !important;}} @media (pointer:fine) and (min-width:1020px) and (max-width:1179.98px){:where(html){zoom:0.864407 !important;}} @media (pointer:fine) and (min-width:1022px) and (max-width:1179.98px){:where(html){zoom:0.866102 !important;}} @media (pointer:fine) and (min-width:1024px) and (max-width:1179.98px){:where(html){zoom:0.867797 !important;}} @media (pointer:fine) and (min-width:1026px) and (max-width:1179.98px){:where(html){zoom:0.869492 !important;}} @media (pointer:fine) and (min-width:1028px) and (max-width:1179.98px){:where(html){zoom:0.871186 !important;}} @media (pointer:fine) and (min-width:1030px) and (max-width:1179.98px){:where(html){zoom:0.872881 !important;}} @media (pointer:fine) and (min-width:1032px) and (max-width:1179.98px){:where(html){zoom:0.874576 !important;}} @media (pointer:fine) and (min-width:1034px) and (max-width:1179.98px){:where(html){zoom:0.876271 !important;}} @media (pointer:fine) and (min-width:1036px) and (max-width:1179.98px){:where(html){zoom:0.877966 !important;}} @media (pointer:fine) and (min-width:1038px) and (max-width:1179.98px){:where(html){zoom:0.879661 !important;}} @media (pointer:fine) and (min-width:1040px) and (max-width:1179.98px){:where(html){zoom:0.881356 !important;}} @media (pointer:fine) and (min-width:1042px) and (max-width:1179.98px){:where(html){zoom:0.883051 !important;}} @media (pointer:fine) and (min-width:1044px) and (max-width:1179.98px){:where(html){zoom:0.884746 !important;}} @media (pointer:fine) and (min-width:1046px) and (max-width:1179.98px){:where(html){zoom:0.886441 !important;}} @media (pointer:fine) and (min-width:1048px) and (max-width:1179.98px){:where(html){zoom:0.888136 !important;}} @media (pointer:fine) and (min-width:1050px) and (max-width:1179.98px){:where(html){zoom:0.889831 !important;}} @media (pointer:fine) and (min-width:1052px) and (max-width:1179.98px){:where(html){zoom:0.891525 !important;}} @media (pointer:fine) and (min-width:1054px) and (max-width:1179.98px){:where(html){zoom:0.89322 !important;}} @media (pointer:fine) and (min-width:1056px) and (max-width:1179.98px){:where(html){zoom:0.894915 !important;}} @media (pointer:fine) and (min-width:1058px) and (max-width:1179.98px){:where(html){zoom:0.89661 !important;}} @media (pointer:fine) and (min-width:1060px) and (max-width:1179.98px){:where(html){zoom:0.898305 !important;}} @media (pointer:fine) and (min-width:1062px) and (max-width:1179.98px){:where(html){zoom:0.9 !important;}} @media (pointer:fine) and (min-width:1064px) and (max-width:1179.98px){:where(html){zoom:0.901695 !important;}} @media (pointer:fine) and (min-width:1066px) and (max-width:1179.98px){:where(html){zoom:0.90339 !important;}} @media (pointer:fine) and (min-width:1068px) and (max-width:1179.98px){:where(html){zoom:0.905085 !important;}} @media (pointer:fine) and (min-width:1070px) and (max-width:1179.98px){:where(html){zoom:0.90678 !important;}} @media (pointer:fine) and (min-width:1072px) and (max-width:1179.98px){:where(html){zoom:0.908475 !important;}} @media (pointer:fine) and (min-width:1074px) and (max-width:1179.98px){:where(html){zoom:0.910169 !important;}} @media (pointer:fine) and (min-width:1076px) and (max-width:1179.98px){:where(html){zoom:0.911864 !important;}} @media (pointer:fine) and (min-width:1078px) and (max-width:1179.98px){:where(html){zoom:0.913559 !important;}} @media (pointer:fine) and (min-width:1080px) and (max-width:1179.98px){:where(html){zoom:0.915254 !important;}} @media (pointer:fine) and (min-width:1082px) and (max-width:1179.98px){:where(html){zoom:0.916949 !important;}} @media (pointer:fine) and (min-width:1084px) and (max-width:1179.98px){:where(html){zoom:0.918644 !important;}} @media (pointer:fine) and (min-width:1086px) and (max-width:1179.98px){:where(html){zoom:0.920339 !important;}} @media (pointer:fine) and (min-width:1088px) and (max-width:1179.98px){:where(html){zoom:0.922034 !important;}} @media (pointer:fine) and (min-width:1090px) and (max-width:1179.98px){:where(html){zoom:0.923729 !important;}} @media (pointer:fine) and (min-width:1092px) and (max-width:1179.98px){:where(html){zoom:0.925424 !important;}} @media (pointer:fine) and (min-width:1094px) and (max-width:1179.98px){:where(html){zoom:0.927119 !important;}} @media (pointer:fine) and (min-width:1096px) and (max-width:1179.98px){:where(html){zoom:0.928814 !important;}} @media (pointer:fine) and (min-width:1098px) and (max-width:1179.98px){:where(html){zoom:0.930508 !important;}} @media (pointer:fine) and (min-width:1100px) and (max-width:1179.98px){:where(html){zoom:0.932203 !important;}} @media (pointer:fine) and (min-width:1102px) and (max-width:1179.98px){:where(html){zoom:0.933898 !important;}} @media (pointer:fine) and (min-width:1104px) and (max-width:1179.98px){:where(html){zoom:0.935593 !important;}} @media (pointer:fine) and (min-width:1106px) and (max-width:1179.98px){:where(html){zoom:0.937288 !important;}} @media (pointer:fine) and (min-width:1108px) and (max-width:1179.98px){:where(html){zoom:0.938983 !important;}} @media (pointer:fine) and (min-width:1110px) and (max-width:1179.98px){:where(html){zoom:0.940678 !important;}} @media (pointer:fine) and (min-width:1112px) and (max-width:1179.98px){:where(html){zoom:0.942373 !important;}} @media (pointer:fine) and (min-width:1114px) and (max-width:1179.98px){:where(html){zoom:0.944068 !important;}} @media (pointer:fine) and (min-width:1116px) and (max-width:1179.98px){:where(html){zoom:0.945763 !important;}} @media (pointer:fine) and (min-width:1118px) and (max-width:1179.98px){:where(html){zoom:0.947458 !important;}} @media (pointer:fine) and (min-width:1120px) and (max-width:1179.98px){:where(html){zoom:0.949153 !important;}} @media (pointer:fine) and (min-width:1122px) and (max-width:1179.98px){:where(html){zoom:0.950847 !important;}} @media (pointer:fine) and (min-width:1124px) and (max-width:1179.98px){:where(html){zoom:0.952542 !important;}} @media (pointer:fine) and (min-width:1126px) and (max-width:1179.98px){:where(html){zoom:0.954237 !important;}} @media (pointer:fine) and (min-width:1128px) and (max-width:1179.98px){:where(html){zoom:0.955932 !important;}} @media (pointer:fine) and (min-width:1130px) and (max-width:1179.98px){:where(html){zoom:0.957627 !important;}} @media (pointer:fine) and (min-width:1132px) and (max-width:1179.98px){:where(html){zoom:0.959322 !important;}} @media (pointer:fine) and (min-width:1134px) and (max-width:1179.98px){:where(html){zoom:0.961017 !important;}} @media (pointer:fine) and (min-width:1136px) and (max-width:1179.98px){:where(html){zoom:0.962712 !important;}} @media (pointer:fine) and (min-width:1138px) and (max-width:1179.98px){:where(html){zoom:0.964407 !important;}} @media (pointer:fine) and (min-width:1140px) and (max-width:1179.98px){:where(html){zoom:0.966102 !important;}} @media (pointer:fine) and (min-width:1142px) and (max-width:1179.98px){:where(html){zoom:0.967797 !important;}} @media (pointer:fine) and (min-width:1144px) and (max-width:1179.98px){:where(html){zoom:0.969492 !important;}} @media (pointer:fine) and (min-width:1146px) and (max-width:1179.98px){:where(html){zoom:0.971186 !important;}} @media (pointer:fine) and (min-width:1148px) and (max-width:1179.98px){:where(html){zoom:0.972881 !important;}} @media (pointer:fine) and (min-width:1150px) and (max-width:1179.98px){:where(html){zoom:0.974576 !important;}} @media (pointer:fine) and (min-width:1152px) and (max-width:1179.98px){:where(html){zoom:0.976271 !important;}} @media (pointer:fine) and (min-width:1154px) and (max-width:1179.98px){:where(html){zoom:0.977966 !important;}} @media (pointer:fine) and (min-width:1156px) and (max-width:1179.98px){:where(html){zoom:0.979661 !important;}} @media (pointer:fine) and (min-width:1158px) and (max-width:1179.98px){:where(html){zoom:0.981356 !important;}} @media (pointer:fine) and (min-width:1160px) and (max-width:1179.98px){:where(html){zoom:0.983051 !important;}} @media (pointer:fine) and (min-width:1162px) and (max-width:1179.98px){:where(html){zoom:0.984746 !important;}} @media (pointer:fine) and (min-width:1164px) and (max-width:1179.98px){:where(html){zoom:0.986441 !important;}} @media (pointer:fine) and (min-width:1166px) and (max-width:1179.98px){:where(html){zoom:0.988136 !important;}} @media (pointer:fine) and (min-width:1168px) and (max-width:1179.98px){:where(html){zoom:0.989831 !important;}} @media (pointer:fine) and (min-width:1170px) and (max-width:1179.98px){:where(html){zoom:0.991525 !important;}} @media (pointer:fine) and (min-width:1172px) and (max-width:1179.98px){:where(html){zoom:0.99322 !important;}} @media (pointer:fine) and (min-width:1174px) and (max-width:1179.98px){:where(html){zoom:0.994915 !important;}} @media (pointer:fine) and (min-width:1176px) and (max-width:1179.98px){:where(html){zoom:0.99661 !important;}} @media (pointer:fine) and (min-width:1178px) and (max-width:1179.98px){:where(html){zoom:0.998305 !important;}} /* ============ 2. base system ============ */ /* Islamifiq — editorial site system (Beauty-in-Stem × TrueKind register). Bone surface · greige neutrals · near-black ink · brass ~8% accent. Sora (display, UPPERCASE heroes) · Hanken (body) · JetBrains Mono (labels). */ :root{--brass:#380E0E; --brass-bright:#380E0E; --brass-deep:#1A1A1A; --black:#111111; --ink:#1A1A1A; --ink-soft:#5E5E5E; --greige-700:#5E5E5E; --greige-500:#8C8C8C; --greige-300:#C4C4C4; --greige-100:#EBEBEB; --bone:#F1F1F1; --chalk:#F1F1F1; --white:#FFFFFF; --hair:#DADADA; --sans:"Hanken Grotesk",system-ui,sans-serif; --head:"Sora",system-ui,sans-serif; --mono:"JetBrains Mono",ui-monospace,monospace; --nav-h:74px;} *{box-sizing:border-box;margin:0;padding:0;} html{scroll-behavior:smooth;} body{background:var(--white);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;line-height:1.6;font-size:17px;overflow-x:hidden;} a{color:inherit;text-decoration:none;} img{display:block;max-width:100%;} .container{max-width:1280px;margin:0 auto;padding:0 40px;} .wide{max-width:1600px;margin:0 auto;padding:0 40px;} /* ---- type ---- */ .display{font-family:var(--head);font-weight:300;text-transform:uppercase;letter-spacing:-.01em;line-height:.98;color:var(--black);} .h-xl{font-size:clamp(44px,7vw,104px);} .h-lg{font-size:clamp(36px,5vw,68px);} .h-md{font-size:clamp(28px,3.4vw,44px);} .serifless{font-family:var(--head);font-weight:300;letter-spacing:-.02em;color:var(--black);text-transform:none;} .label{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--brass-deep);} .lead{font-size:18px;color:var(--ink-soft);line-height:1.62;} .eyebrow{display:inline-flex;align-items:center;gap:10px;} .eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brass);} /* ---- shapes / placeholders ---- */ .arch{clip-path:url(#archClip);-webkit-clip-path:url(#archClip);} .cap{border-radius:140px 140px 18px 18px;} .round{border-radius:50%;} .ph{position:relative;background:var(--greige-100);background-image:repeating-linear-gradient(135deg, rgba(148,124,68,.09) 0 12px, transparent 12px 24px);display:flex;align-items:center;justify-content:center;overflow:hidden;} .ph::after{content:attr(data-label);font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);text-align:center;padding:0 16px;max-width:78%;} .divider{display:flex;align-items:center;gap:14px;} .divider .rule{flex:1;height:1px;background:var(--hair);} .divider .dia{width:8px;height:8px;transform:rotate(45deg);border:1px solid var(--brass-deep);} /* ---- nav: centered logo ---- */ /* slim announcement bar */ .announce{background:#380E0E;color:var(--black);text-align:center;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;padding:9px 16px;} .announce b{font-weight:600;} .announce .sep{margin:0 13px;opacity:.45;} .nav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.3) blur(14px);border-bottom:1px solid var(--hair);height:var(--nav-h);display:flex;align-items:center;transition:background .3s ease,box-shadow .3s ease,height .3s ease,border-color .3s ease;} .nav.scrolled{background:rgba(255,255,255,.97);border-bottom-color:var(--hair);box-shadow:0 6px 26px rgba(22,21,16,.07);height:64px;} .nav .row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;width:100%;} .nav .brand{justify-self:start;display:inline-flex;} .nav .brand img{height:21px;width:auto;transition:height .3s ease;} .nav.scrolled .brand img{height:19px;} .nav .center{justify-self:center;display:flex;gap:42px;align-items:center;} .nav .right{display:flex;gap:6px;align-items:center;justify-self:end;} .nav .center a{font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.005em;color:var(--ink);position:relative;padding:8px 4px;transition:color .2s;} .nav .center a:hover{color:var(--brass-deep);} .nav .center a.active{color:var(--brass-deep);font-weight:600;} .nav .ic{display:inline-flex;align-items:center;justify-content:center;gap:5px;width:40px;height:40px;border-radius:50%;color:var(--black);transition:background .2s ease,color .2s ease;position:relative;} .nav .ic:hover{background:var(--greige-100);} .nav .ic svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.85;transition:stroke .2s;} .nav .ic:hover svg{stroke:var(--brass-deep);} .nav .ic.cart{width:auto;padding:0 12px;border-radius:100px;gap:7px;} .nav .ic .ct{font-family:var(--mono);font-size:10px;font-variant-numeric:tabular-nums;background:var(--black);color:var(--bone);width:17px;height:17px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;} .burger{display:none;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px;padding:6px;} .burger span{width:22px;height:2px;background:var(--black);display:block;transition:transform .25s,opacity .2s;} .nav.open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg);} .nav.open .burger span:nth-child(2){opacity:0;} .nav.open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);} /* ---- buttons ---- */ .btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;padding:15px 26px;border-radius:2px;transition:transform .15s,filter .15s,background .15s,color .15s;border:1px solid transparent;cursor:pointer;} .btn-dark{background:var(--black);color:var(--bone);} .btn-dark:hover{filter:brightness(1.5);} .btn-brass{background:#380E0E;color:var(--black);} .btn-brass:hover{filter:none;background:#380E0E;} .btn-line{border-color:var(--ink);color:var(--ink);background:transparent;} .btn-line:hover{background:var(--ink);color:var(--bone);} .btn-line-light{border-color:rgba(246,243,235,.5);color:var(--bone);background:transparent;} .btn-line-light:hover{background:var(--bone);color:var(--black);} /* ---- full-bleed hero ---- */ .hero-full{position:relative;min-height:calc(100vh - var(--nav-h));display:flex;align-items:flex-end;overflow:hidden;} .hero-full.center{align-items:center;text-align:center;} .hero-full .bg{position:absolute;inset:0;z-index:0;} .hero-full .bg .ph{width:100%;height:100%;} .hero-full .bg .ph::after{position:absolute;left:24px;bottom:20px;max-width:44%;text-align:left;opacity:.6;} .hero-full .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(22,21,16,.28) 0%,rgba(22,21,16,.30) 55%,rgba(22,21,16,.46) 100%);} .hero-full .content{position:relative;z-index:2;width:100%;padding:0 0 8vh;} .hero-full.center .content{padding:0;display:flex;flex-direction:column;align-items:center;} .hero-full .content .display{color:var(--bone);} .hero-full .content .sub{color:rgba(246,243,235,.86);font-size:19px;max-width:40ch;margin:18px 0 28px;} /* split hero (image + panel) */ .hero-split{display:grid;grid-template-columns:1fr 1fr;min-height:calc(100vh - var(--nav-h));} .hero-split .panel{display:flex;flex-direction:column;justify-content:center;padding:7vh 6vw;background:var(--white);} .hero-split .vis{position:relative;} .hero-split .vis .ph{position:absolute;inset:0;} /* ---- sections ---- */ section{padding:clamp(64px,9vw,128px) 0;} .sec-white{background:var(--white);} .sec-chalk{background:var(--chalk);} .sec-alt{background:var(--white);} .sec-white+.sec-white{position:relative;} .sec-white+.sec-white::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(1232px,calc(100% - 48px));height:1px;background:var(--hair);} .sec-dark{background:var(--black);color:#F1F1F1;} .sec-dark .display,.sec-dark .serifless{color:#F1F1F1;} .sec-dark .lead{color:rgba(255,255,255,.72);} .sec-dark .label{color:var(--brass);} .sec-head{margin-bottom:54px;} .sec-head .label{margin-bottom:16px;display:inline-block;} /* values marquee */ .marquee{border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);overflow:hidden;background:var(--white);padding:20px 0;} .marquee .track{display:flex;gap:0;white-space:nowrap;width:max-content;animation:scrollx 32s linear infinite;} .marquee .item{display:inline-flex;align-items:center;gap:30px;padding:0 30px;font-family:var(--head);font-size:18px;text-transform:uppercase;letter-spacing:.02em;color:var(--ink);} .marquee .item::after{content:"✦";color:var(--brass-deep);font-size:13px;} @keyframes scrollx{to{transform:translateX(-50%);}} @media (prefers-reduced-motion:reduce){ .marquee .track{animation:none;} } /* numbered systems */ .steps{display:flex;flex-direction:column;gap:0;} .step{display:grid;grid-template-columns:140px minmax(0,1.15fr) minmax(0,1fr);gap:40px 64px;align-items:start;padding:48px 0;border-top:1px solid var(--hair);} .step:last-child{border-bottom:1px solid var(--hair);} .step .no{font-family:var(--head);font-weight:300;font-size:64px;color:var(--brass);line-height:.8;padding-top:14px;} .step .no small{font-size:30px;color:var(--brass-deep);} .step h3{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:30px;letter-spacing:-.01em;color:var(--black);margin-bottom:8px;} .step .term{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:14px;} .step p{font-size:15px;color:var(--ink-soft);line-height:1.6;padding-top:26px;} .step .vis{height:150px;border-radius:10px;overflow:hidden;} .step .vis .ph{width:100%;height:100%;} /* collection grid */ .coll{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;} .prod{display:block;} .prod .img{aspect-ratio:.84;background:var(--chalk);border-radius:4px;overflow:hidden;display:flex;align-items:center;justify-content:center;margin-bottom:18px;position:relative;transition:background .3s;} .prod .img .ph{width:64%;height:78%;border-radius:3px;} .prod:hover .img{background:var(--greige-100);} .prod .nm{font-family:var(--head);font-weight:400;font-size:16px;text-transform:uppercase;letter-spacing:.01em;color:var(--black);} .prod .meta{display:flex;justify-content:space-between;align-items:baseline;margin-top:4px;} .prod .desc{font-size:12.5px;color:var(--ink-soft);} .prod .price{font-family:var(--mono);font-size:13px;color:var(--ink);} /* feature rows */ .feature{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;} .feature+.feature{margin-top:90px;} .feature.flip .txt{order:2;} .feature .vis{aspect-ratio:1;border-radius:6px;overflow:hidden;} .feature .vis .ph{width:100%;height:100%;} .feature h3{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(26px,3vw,38px);color:var(--black);letter-spacing:-.01em;line-height:1.04;margin-bottom:16px;} .feature .n{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:14px;} .feature p{font-size:15.5px;color:var(--ink-soft);line-height:1.65;margin-bottom:12px;} /* value cards (TrueKind difference grid) */ .vgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px 24px;} .vcard{text-align:center;} .vcard .ico{width:74px;height:74px;border-radius:50%;background:var(--chalk);display:flex;align-items:center;justify-content:center;margin:0 auto 18px;} .vcard .ico svg{width:30px;height:30px;stroke:var(--brass-deep);fill:none;stroke-width:1.5;} .vcard h4{font-family:var(--head);font-weight:400;font-size:16px;text-transform:uppercase;letter-spacing:.01em;color:var(--black);margin-bottom:10px;} .vcard p{font-size:13.5px;color:var(--ink-soft);line-height:1.55;} /* testimonials */ .tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;} .tcard{background:var(--white);border:1px solid var(--hair);border-radius:8px;padding:34px 30px;text-align:center;} .tcard .av{width:88px;height:88px;border-radius:50%;overflow:hidden;margin:0 auto 18px;} .tcard .av .ph{width:100%;height:100%;} .tcard .nm{font-family:var(--head);font-weight:500;font-size:17px;color:var(--black);} .tcard .role{font-size:12px;color:var(--ink-soft);margin:4px 0 14px;} .tcard .stars{color:var(--brass);letter-spacing:3px;margin-bottom:14px;font-size:13px;} .tcard p{font-size:14px;color:var(--ink);line-height:1.6;} /* FAQ accordion */ .faq{max-width:760px;} .faq .q{border-top:1px solid var(--hair);} .faq .q:last-child{border-bottom:1px solid var(--hair);} .faq .q button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 0;background:none;border:0;cursor:pointer;text-align:left;font-family:var(--head);font-weight:400;font-size:19px;color:var(--black);} .faq .q .plus{font-size:22px;color:var(--brass-deep);flex:none;transition:transform .25s;} .faq .q.open .plus{transform:rotate(45deg);} .faq .q .a{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease;} .faq .q.open .a{max-height:240px;padding-bottom:24px;} .faq .q .a p{font-size:15px;color:var(--ink-soft);line-height:1.65;} /* library / blog cards */ .bgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;} .bcard .img{aspect-ratio:1.1;border-radius:6px;overflow:hidden;margin-bottom:18px;} .bcard .img .ph{width:100%;height:100%;} .bcard h4{font-family:var(--head);font-weight:400;font-size:18px;color:var(--black);line-height:1.2;margin-bottom:12px;} .bcard .row{display:flex;justify-content:space-between;align-items:center;} .bcard .date{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);} .bcard .more{font-size:13px;font-weight:600;color:var(--black);border-bottom:1px solid var(--brass);padding-bottom:2px;} /* big CTA band */ .cta-band{text-align:center;} .cta-band .display{font-size:clamp(30px,4vw,52px);margin-bottom:34px;} .cta-band .label{margin-bottom:14px;} .cta-band .lead{max-width:46ch;margin:0 auto 30px;} /* newsletter strip (dark) */ .news{background:var(--white);color:var(--ink);border-top:1px solid var(--hair);} .news .row{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;} .news h3{font-family:var(--head);font-weight:300;font-size:clamp(26px,3vw,40px);color:var(--black);line-height:1.08;letter-spacing:-.01em;} .news .form{display:flex;border:1px solid var(--greige-300);border-radius:100px;overflow:hidden;background:var(--white);} .news .form input{flex:1;background:none;border:0;outline:none;color:var(--ink);font-family:var(--sans);font-size:15px;padding:16px 24px;} .news .form input::placeholder{color:var(--greige-500);} .news .form button{background:var(--black);color:var(--bone);border:0;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;padding:0 28px;cursor:pointer;border-radius:100px;margin:5px;} /* modern footer — near-black, brass top hairline */ .foot{background:var(--black);color:#F1F1F1;padding:96px 0 44px;border-top:2px solid var(--brass);} .foot-top{display:grid;grid-template-columns:1.4fr 2fr;gap:80px;padding-bottom:64px;border-bottom:1px solid rgba(255,255,255,.12);} .foot-brand .foot-logo{height:28px;filter:brightness(0) invert(1);margin-bottom:24px;} .foot-brand p{font-size:15px;line-height:1.7;color:rgba(255,255,255,.7);max-width:36ch;margin-bottom:28px;} .foot-social{display:flex;gap:12px;} .foot-social a{width:42px;height:42px;border:1px solid rgba(255,255,255,.2);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;transition:border-color .2s,background .2s;} .foot-social a:hover{border-color:var(--brass);background:rgba(56,14,14,.12);} .foot-social svg{width:18px;height:18px;stroke:#F1F1F1;fill:none;stroke-width:1.6;} .foot-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;} .foot-cols h5{font-family:var(--mono);font-size:12.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--brass);margin-bottom:22px;} .foot-cols ul{list-style:none;display:flex;flex-direction:column;gap:14px;} .foot-cols li a{font-size:15px;color:rgba(255,255,255,.72);transition:color .15s;} .foot-cols li a:hover{color:var(--brass-bright);} .foot-base{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:32px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5);} .foot-legal{display:flex;gap:22px;align-items:center;} .foot-legal a{transition:color .15s;} .foot-legal a:hover{color:var(--brass);} @media (pointer:coarse) and (max-width:760px){ .foot{padding:64px 0 36px;} .foot-top{grid-template-columns:1fr;gap:44px;padding-bottom:44px;} .foot-cols{grid-template-columns:1fr 1fr;gap:32px;} .foot-base{flex-direction:column;align-items:flex-start;gap:10px;} } /* philosophy manifesto */ .manifesto{text-align:center;max-width:1000px;margin:0 auto;} .manifesto .label{justify-content:center;} .manifesto h2{margin:20px auto 0;max-width:22ch;color:var(--black);text-wrap:balance;} .manifesto-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:54px 0 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);} .manifesto .mf{padding:36px 32px;text-align:left;border-right:1px solid var(--hair);} .manifesto .mf:last-child{border-right:0;} .manifesto .mf .k{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:15px;letter-spacing:.02em;color:var(--brass-deep);margin-bottom:18px;} .manifesto .mf p{font-size:15px;line-height:1.75;color:var(--ink-soft);margin:0;} @media (pointer:coarse) and (max-width:820px){ .manifesto-grid{grid-template-columns:1fr;} .manifesto .mf{border-right:0;border-bottom:1px solid var(--hair);padding:28px 8px;} .manifesto .mf:last-child{border-bottom:0;} } /* overlays: search, account, cart */ .ov-backdrop{position:fixed;inset:0;background:rgba(22,21,16,.5);opacity:0;visibility:hidden;transition:opacity .3s;z-index:90;} .ov-backdrop.open{opacity:1;visibility:visible;} .cart-drawer{position:fixed;top:0;right:0;height:100%;width:420px;max-width:92vw;background:var(--white);z-index:100;transform:translateX(100%);transition:transform .35s cubic-bezier(.4,0,.1,1);display:flex;flex-direction:column;box-shadow:-20px 0 50px rgba(22,21,16,.18);} .cart-drawer.open{transform:none;} .cart-head{display:flex;justify-content:space-between;align-items:center;padding:24px 26px;border-bottom:1px solid var(--hair);} .cart-head h3{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:18px;letter-spacing:.02em;color:var(--black);} .cart-close{background:none;border:0;cursor:pointer;font-size:24px;color:var(--ink);line-height:1;} .cart-items{flex:1;overflow-y:auto;padding:6px 26px;} .cart-empty{text-align:center;color:var(--ink-soft);padding:60px 20px;font-size:15px;line-height:1.7;} .cart-item{display:grid;grid-template-columns:60px 1fr auto;gap:14px;padding:18px 0;border-bottom:1px solid var(--hair);align-items:start;} .cart-item .thumb{width:60px;height:76px;border-radius:4px;overflow:hidden;background:var(--chalk);} .cart-item .thumb .ph{width:100%;height:100%;} .cart-item .nm{font-family:var(--head);font-size:13.5px;text-transform:uppercase;color:var(--black);line-height:1.1;} .cart-item .vr{font-size:12px;color:var(--ink-soft);margin:4px 0 9px;} .cart-item .qrow{display:flex;align-items:center;border:1px solid var(--greige-300);border-radius:3px;width:max-content;} .cart-item .qrow button{background:none;border:0;width:28px;height:28px;cursor:pointer;font-size:15px;color:var(--ink);} .cart-item .qrow span{width:26px;text-align:center;font-size:13px;font-variant-numeric:tabular-nums;} .cart-item .pr{font-family:var(--mono);font-size:13px;color:var(--ink);text-align:right;white-space:nowrap;} .cart-item .rm{display:block;margin-top:9px;font-size:11px;color:var(--ink-soft);text-decoration:underline;cursor:pointer;background:none;border:0;padding:0;} .cart-foot{padding:22px 26px;border-top:1px solid var(--hair);} .cart-foot .sub{display:flex;justify-content:space-between;font-size:16px;margin-bottom:6px;color:var(--black);} .cart-foot .sub .t{font-family:var(--head);text-transform:uppercase;} .cart-foot .note{font-size:12px;color:var(--ink-soft);margin-bottom:16px;line-height:1.5;} .cart-foot .btn{width:100%;justify-content:center;} .search-ov{position:fixed;inset:0;z-index:100;background:rgba(246,243,235,.98);backdrop-filter:blur(8px);opacity:0;visibility:hidden;transition:opacity .3s;display:flex;flex-direction:column;} .search-ov.open{opacity:1;visibility:visible;} .search-ov .top{display:flex;justify-content:flex-end;padding:24px 40px;} .search-ov .top button{background:none;border:0;font-size:28px;cursor:pointer;color:var(--ink);line-height:1;} .search-ov .body{max-width:760px;margin:5vh auto 0;width:100%;padding:0 24px;} .search-ov .field{display:flex;align-items:center;gap:14px;border-bottom:2px solid var(--ink);padding-bottom:16px;} .search-ov .field svg{width:26px;height:26px;stroke:var(--ink);fill:none;stroke-width:1.6;flex:none;} .search-ov .field input{flex:1;background:none;border:0;outline:none;font-family:var(--head);font-weight:300;font-size:clamp(22px,4vw,38px);color:var(--black);} .search-ov .sug{margin-top:30px;} .search-ov .sug .k{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:14px;} .search-ov .sug a{display:inline-block;margin:0 10px 10px 0;border:1px solid var(--greige-300);border-radius:100px;padding:9px 18px;font-size:14px;color:var(--ink);transition:border-color .2s;} .search-ov .sug a:hover{border-color:var(--brass-deep);color:var(--black);} .acct-modal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;visibility:hidden;transition:opacity .3s;} .acct-modal.open{opacity:1;visibility:visible;} .acct-card{background:var(--white);border-radius:14px;max-width:420px;width:100%;padding:40px;position:relative;box-shadow:0 30px 70px rgba(22,21,16,.25);} .acct-card .x{position:absolute;top:14px;right:18px;background:none;border:0;font-size:24px;cursor:pointer;color:var(--ink);line-height:1;} .acct-card h3{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:26px;letter-spacing:-.01em;margin-bottom:6px;color:var(--black);} .acct-card p.sub{font-size:14px;color:var(--ink-soft);margin-bottom:24px;} .acct-card .field{display:flex;flex-direction:column;gap:7px;margin-bottom:16px;} .acct-card label{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-deep);} .acct-card input{font-family:var(--sans);font-size:15px;background:var(--white);border:1px solid var(--greige-300);border-radius:4px;padding:13px 15px;outline:none;transition:border-color .2s;} .acct-card input:focus{border-color:var(--brass-deep);} .acct-card .btn{width:100%;justify-content:center;margin-top:4px;} .acct-card .alt{text-align:center;font-size:13px;color:var(--ink-soft);margin-top:18px;} .acct-card .alt a{color:var(--black);border-bottom:1px solid var(--brass);cursor:pointer;} @media (pointer:coarse) and (max-width:480px){ .cart-drawer{width:100%;} } /* reveal */ html.js .reveal{opacity:0;transform:translateY(20px);transition:opacity .8s ease,transform .8s ease;} html.js .reveal.in{opacity:1;transform:none;} @media (prefers-reduced-motion:reduce){ html.js .reveal{opacity:1;transform:none;transition:none;} } @media (pointer:coarse) and (max-width:980px){ .coll{grid-template-columns:1fr 1fr;} .vgrid{grid-template-columns:1fr 1fr;} .tgrid{grid-template-columns:1fr;} .feature,.hero-split,.news .row{grid-template-columns:1fr;} .feature.flip .txt{order:0;} .bgrid{grid-template-columns:1fr;} .step{grid-template-columns:70px 1fr;} .step .vis{display:none;} } @media (pointer:coarse) and (max-width:760px){ .nav .center{display:none;} .nav .row{grid-template-columns:auto 1fr auto;} .nav .brand{justify-self:start;} .burger{display:flex;} .nav.open .center{display:flex;position:fixed;inset:var(--nav-h) 0 auto 0;flex-direction:column;gap:0;background:var(--white);border-bottom:1px solid var(--hair);padding:8px 22px 18px;} .nav.open .center a{padding:14px 0;border-bottom:1px solid var(--hair);width:100%;font-size:16px;} } /* reviews carousel */ .reviews{overflow:hidden;} .reviews .rtrack{display:flex;gap:24px;width:max-content;animation:scrollx 70s linear infinite;} .reviews:hover .rtrack{animation-play-state:paused;} .reviews .tcard{width:340px;flex:none;background:var(--white);} @media(prefers-reduced-motion:reduce){ .reviews .rtrack{animation:none;flex-wrap:wrap;justify-content:center;width:auto;} } /* ============ motion ============ */ .scroll-prog{position:fixed;top:0;left:0;height:2px;width:100%;background:var(--brass);transform:scaleX(0);transform-origin:left center;z-index:95;pointer-events:none;} .nav{transition:transform .38s cubic-bezier(.4,0,.1,1),background .3s,box-shadow .3s;} .nav.nav-away{transform:translateY(-100%);} .st-item{opacity:0;transform:translateY(20px);transition:opacity .7s cubic-bezier(.2,.7,.3,1),transform .7s cubic-bezier(.2,.7,.3,1);} .st-item.in{opacity:1;transform:none;} @media(prefers-reduced-motion:reduce){ .st-item{opacity:1;transform:none;} .scroll-prog{display:none;} .nav.nav-away{transform:none;} } /* ============ form states ============ */ .btn.loading{pointer-events:none;opacity:.75;position:relative;color:transparent!important;} .btn.loading::after{content:"";position:absolute;top:50%;left:50%;margin:-9px 0 0 -9px;width:17px;height:17px;border:2px solid rgba(22,21,16,.25);border-top-color:var(--black);border-radius:50%;animation:om-spin .7s linear infinite;} .btn-dark.loading::after{border-color:rgba(255,255,255,.3);border-top-color:#F1F1F1;} @keyframes om-spin{to{transform:rotate(360deg)}} .form-error,.form-ok{font-size:13.5px;padding:13px 16px;border-radius:0 6px 6px 0;margin-bottom:18px;display:none;line-height:1.55;} .form-error{background:#FDF3F0;border-left:2px solid #B4553F;color:#8E4130;} .form-ok{background:rgba(56,14,14,.12);border-left:2px solid var(--brass);color:#380E0E;} .form-error.on,.form-ok.on{display:block;} .cart-note{background:rgba(56,14,14,.14);border-left:2px solid var(--brass);color:#380E0E;font-size:12.5px;line-height:1.5;padding:11px 14px;border-radius:0 6px 6px 0;margin:14px 0 4px;} /* ============ gallery lightbox ============ */ .lb{position:fixed;inset:0;z-index:120;background:rgba(22,21,16,.94);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .28s;} .lb.open{opacity:1;visibility:visible;} .lb .stage{width:min(88vw,900px);height:min(84vh,820px);position:relative;overflow:hidden;border-radius:10px;background:var(--chalk);cursor:zoom-in;} .lb .stage.zoomed{cursor:zoom-out;} .lb .stage .ph{width:100%;height:100%;transition:transform .38s cubic-bezier(.3,.8,.3,1);transform-origin:center;} .lb .stage.zoomed .ph{transform:scale(2.1);transition:transform .18s ease-out;} .lb .cap{position:absolute;left:0;right:0;bottom:-40px;text-align:center;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.72);} .lb .x{position:absolute;top:22px;right:26px;background:none;border:0;font-size:30px;line-height:1;color:#F1F1F1;cursor:pointer;opacity:.8;} .lb .x:hover{opacity:1;color:var(--brass);} .lb .arw{position:absolute;top:50%;margin-top:-24px;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:rgba(22,21,16,.4);color:#F1F1F1;cursor:pointer;font-size:20px;display:flex;align-items:center;justify-content:center;transition:border-color .2s,background .2s;} .lb .arw:hover{border-color:var(--brass);background:rgba(56,14,14,.16);} .lb .arw.p{left:max(14px,calc(50vw - min(44vw,470px)));} .lb .arw.n{right:max(14px,calc(50vw - min(44vw,470px)));} .lb .zhint{position:absolute;top:24px;left:26px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.55);} .gallery .main{cursor:zoom-in;position:relative;} .gallery .main .zoombtn{position:absolute;bottom:14px;right:14px;width:36px;height:36px;border-radius:50%;background:rgba(246,243,235,.92);border:1px solid var(--hair);display:flex;align-items:center;justify-content:center;pointer-events:none;transition:transform .22s,background .22s;} .gallery .main:hover .zoombtn{transform:scale(1.08);background:var(--white);} .gallery .main .zoombtn svg{width:16px;height:16px;stroke:var(--ink);fill:none;stroke-width:1.7;} /* ============ size reference ============ */ .sizeref{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;} .sizeref .viz{background:var(--white);border:1px solid var(--hair);border-radius:14px;padding:48px 40px 40px;display:flex;align-items:center;justify-content:center;min-height:340px;} .sizeref .obj{display:flex;flex-direction:column;align-items:center;gap:14px;} .sizeref .obj.a4>.box{width:180px;height:254px;border:1px dashed var(--greige-300);border-radius:3px;position:relative;} .sizeref .obj.j{position:absolute;left:0;bottom:0;} .sizeref .obj.j .box{width:127px;height:180px;border:1.5px solid var(--black);border-radius:3px 6px 6px 3px;background:var(--chalk);position:relative;} .sizeref .obj.j .box::before{content:"";position:absolute;left:10px;top:0;bottom:0;width:1px;background:var(--greige-300);} .sizeref .dim{position:absolute;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;color:var(--brass-deep);white-space:nowrap;} .sizeref .dim.w{left:50%;bottom:-24px;transform:translateX(-50%);} .sizeref .dim.h{right:-16px;top:50%;transform:translateY(-50%) rotate(90deg);transform-origin:left center;} .sizeref .obj .lb2{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--greige-500);text-align:center;line-height:1.5;margin-top:18px;} .sizeref dl{margin:22px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:18px 26px;} .sizeref dt{font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:5px;} .sizeref dd{margin:0;font-size:14.5px;color:var(--ink);} @media (pointer:coarse) and (max-width:860px){ .sizeref{grid-template-columns:1fr;gap:34px;} .sizeref dl{grid-template-columns:1fr 1fr;} } /* ============ what's inside walkthrough ============ */ .inside{display:grid;grid-template-columns:280px 1fr;gap:52px;align-items:start;} .inside .rail{display:flex;flex-direction:column;gap:2px;position:sticky;top:100px;} .inside .rail button{all:unset;cursor:pointer;display:flex;gap:14px;align-items:baseline;padding:15px 16px;border-radius:8px;transition:background .2s;} .inside .rail button:hover{background:var(--chalk);} .inside .rail button.on{background:var(--black);} .inside .rail .n{font-family:var(--mono);font-size:10.5px;color:var(--brass-deep);letter-spacing:.06em;flex:none;} .inside .rail button.on .n{color:var(--brass);} .inside .rail .t{font-family:var(--head);font-size:15px;text-transform:uppercase;letter-spacing:.01em;color:var(--ink);} .inside .rail button.on .t{color:#F1F1F1;} .inside .pane{display:none;} .inside .pane.on{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center;animation:fadein .45s ease both;} @keyframes fadein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}} .inside .pane .shot{aspect-ratio:4/3;border-radius:12px;overflow:hidden;background:var(--chalk);border:1px solid var(--hair);} .inside .pane .shot .ph{width:100%;height:100%;} .inside .pane h3{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:22px;letter-spacing:-.005em;color:var(--black);margin-bottom:12px;} .inside .pane p{font-size:15px;color:var(--ink-soft);line-height:1.68;margin-bottom:16px;} .inside .pane ul{list-style:none;display:flex;flex-direction:column;gap:9px;} .inside .pane li{display:flex;gap:11px;font-size:14px;color:var(--ink);line-height:1.5;} .inside .pane li::before{content:"";flex:none;width:5px;height:5px;border-radius:50%;background:var(--brass);margin-top:7px;} .inside .pane .pg{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--greige-500);margin-top:18px;} @media (pointer:coarse) and (max-width:900px){ .inside{grid-template-columns:1fr;gap:28px;} .inside .rail{position:static;flex-direction:row;overflow-x:auto;gap:8px;padding-bottom:6px;} .inside .rail button{flex:none;} .inside .pane.on{grid-template-columns:1fr;} } /* ============ craft / how it's made ============ */ .craft{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;} .craftcard{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:34px 30px;} .craftcard .n{font-family:var(--head);font-weight:300;font-size:34px;color:var(--brass);line-height:1;margin-bottom:20px;} .craftcard h4{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:16px;letter-spacing:.01em;color:#F1F1F1;margin-bottom:10px;} .craftcard p{font-size:14px;color:rgba(255,255,255,.66);line-height:1.65;} .matrow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:56px;border-top:1px solid rgba(255,255,255,.16);} .matrow .m{padding:26px 24px;border-right:1px solid rgba(255,255,255,.16);} .matrow .m:last-child{border-right:0;} .matrow .m:first-child{padding-left:0;} .matrow .k{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass);margin-bottom:8px;} .matrow .v{font-size:14.5px;color:#F1F1F1;line-height:1.45;} @media (pointer:coarse) and (max-width:900px){ .craft{grid-template-columns:1fr;gap:18px;} .matrow{grid-template-columns:1fr 1fr;} .matrow .m{border-bottom:1px solid rgba(255,255,255,.16);} } /* ============ PDP stock + eta ============ */ .stockline{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--ink-soft);margin:-4px 0 18px;} .stockline .dotg{width:7px;height:7px;border-radius:50%;background:#5C8A5E;flex:none;box-shadow:0 0 0 3px rgba(92,138,94,.16);} .stockline .dotg.low{background:#C08A3E;box-shadow:0 0 0 3px rgba(192,138,62,.18);} .stockline b{color:var(--black);font-weight:600;} .etabox{border:1px solid var(--hair);border-radius:10px;padding:16px 18px;margin-top:18px;background:var(--chalk);display:flex;gap:14px;align-items:flex-start;} .etabox svg{width:18px;height:18px;stroke:var(--brass-deep);fill:none;stroke-width:1.6;flex:none;margin-top:1px;} .etabox .cnt{font-size:13.5px;color:var(--ink);line-height:1.6;} .etabox .cnt b{color:var(--black);} .etabox .cnt small{display:block;color:var(--greige-500);font-size:12px;margin-top:4px;} /* ---- page heroes (all inner pages) ---- */ .hero-full.page{min-height:calc(100vh - var(--nav-h));} .hero-full.page .content{padding:0 0 8vh;} /* ---- homepage product: gallery trio ---- */ .trio{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;align-items:start;} .tcov{display:block;color:inherit;} .tcov .ph{aspect-ratio:.78;border-radius:8px;transition:transform .5s cubic-bezier(.2,.7,.2,1);} .tcov.mid{margin-top:64px;} .tcov:hover .ph{transform:translateY(-6px);} .tcov .cap2{display:flex;justify-content:space-between;align-items:baseline;margin-top:14px;} .tcov .cap2 span:first-child{font-family:var(--sans);font-size:14.5px;font-weight:500;color:var(--ink);} .tcov .cap2 span:last-child{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--ink-soft);} .tcov:hover .cap2 span:first-child{color:var(--brass-deep);} .trio-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;} .trio-head .btn{margin-bottom:6px;} .tlink{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--black);padding-bottom:7px;border-bottom:1px solid var(--brass);display:inline-flex;gap:10px;align-items:center;transition:color .2s;white-space:nowrap;margin-bottom:6px;} .tlink span{transition:transform .3s;} .tlink:hover{color:var(--brass-deep);} .tlink:hover span{transform:translateX(4px);} .trio-foot p{font-size:15px;line-height:1.66;color:var(--ink-soft);max-width:56ch;margin:0;} @media (pointer:coarse) and (max-width:760px){ .trio{grid-template-columns:1fr 1fr;} .tcov.mid{grid-column:1/-1;max-width:70%;margin:0 auto;} } /* ---- manifesto on cream: visible boxes, more air ---- */ .sec-chalk .manifesto-grid{border:0;gap:24px;margin:54px 0 0;} .sec-chalk .manifesto .mf{background:var(--white);border:1px solid var(--greige-300);border-radius:12px;padding:40px 34px;} .manifesto h2{margin-top:16px;} .manifesto .mf .k{margin-bottom:14px;} .manifesto .mf p{line-height:1.72;} /* ---- page by page: bigger image, wider copy, calmer rail ---- */ .inside{grid-template-columns:240px 1fr;gap:72px;} .inside .rail{gap:6px;} .inside .rail button{padding:14px 18px;} .inside .pane.on{grid-template-columns:1fr 1fr;gap:64px;align-items:center;} .inside .pane .shot{aspect-ratio:4/3;min-height:0;border-radius:14px;} .inside .pane .txt{padding:8px 0;} .inside .pane h3{font-size:22px;margin-bottom:16px;line-height:1.15;} .inside .pane p{font-size:15.5px;line-height:1.72;margin-bottom:22px;} .inside .pane ul{gap:12px;} .inside .pane .pg{margin-top:26px;padding-top:18px;border-top:1px solid var(--hair);} @media (pointer:coarse) and (max-width:1000px){ .inside{grid-template-columns:1fr;gap:36px;} .inside .pane.on{grid-template-columns:1fr;gap:28px;} .inside .pane .txt{padding:0;} } /* ---- cream sections: hairlines strong enough to read ---- */ .sec-chalk .vcard .ico,.sec-chalk .tcard,.sec-chalk .faq .q,.sec-chalk .step,.sec-chalk .step:last-child,.sec-chalk .road .item,.sec-chalk .sizeref .viz{border-color:var(--greige-300);} /* ---- manifesto on black ---- */ .sec-dark .manifesto h2{color:#F1F1F1;} .sec-dark .manifesto-grid{border:0;gap:32px;margin:72px 0 0;} .sec-dark .manifesto .mf{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:48px 42px 52px;} .sec-dark .manifesto .mf p{color:rgba(255,255,255,.72);} .sec-dark .btn-line{border-color:rgba(255,255,255,.4);color:#F1F1F1;} .sec-dark .btn-line:hover{border-color:var(--brass);color:var(--brass-bright);} /* ---- conviction: arch split ---- */ .conv{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(40px,5vw,72px);align-items:center;} .conv .label{margin-bottom:20px;} .conv h2{line-height:1.04;margin-bottom:24px;white-space:nowrap;} .conv h2 .br{color:var(--brass-deep);} .conv .lead{max-width:44ch;} .conv .vis{aspect-ratio:.92;max-height:500px;} .conv .vis .ph{width:100%;height:100%;} @media (pointer:coarse) and (max-width:860px){ .conv{grid-template-columns:1fr;gap:36px;} .conv h2{white-space:normal;} .conv .vis{max-width:420px;aspect-ratio:.86;} } .sec-dark .manifesto{padding:24px 0;} /* ---- how it's made: materials strip (dark) ---- */ .matlist{display:grid;grid-template-columns:repeat(4,1fr);margin:64px 0 0;padding-top:34px;border-top:1px solid rgba(255,255,255,.16);} .matlist>div{padding:0 32px;border-right:1px solid rgba(255,255,255,.16);} .matlist>div:first-child{padding-left:0;} .matlist>div:last-child{border-right:0;padding-right:0;} .matlist dt{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);margin:0 0 12px;} .matlist dd{font-family:var(--head);font-weight:300;font-size:19px;line-height:1.3;letter-spacing:-.01em;color:#F1F1F1;margin:0;text-wrap:pretty;} @media (pointer:coarse) and (max-width:820px){ .matlist{grid-template-columns:1fr 1fr;row-gap:28px;} .matlist>div{padding:0 0 0 0;border-right:0;} .matlist>div:nth-child(odd){padding-right:24px;border-right:1px solid rgba(255,255,255,.16);} .matlist>div:nth-child(even){padding-left:24px;} } /* ---- journal: annotated daily spread + contents ---- */ .anno{display:grid;grid-template-columns:1.5fr .95fr;gap:56px;align-items:center;} .anno-shot{position:relative;aspect-ratio:1/1;border-radius:14px;overflow:hidden;background:var(--chalk);border:1px solid var(--greige-300);} .anno-shot .ph{width:100%;height:100%;} .anno-shot .pin{position:absolute;width:26px;height:26px;border-radius:50%;background:var(--black);color:#F1F1F1;font-family:var(--mono);font-size:11px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 4px rgba(246,243,235,.85);z-index:2;} .anno-list{list-style:none;margin:0;padding:0;display:grid;gap:0;} .anno-list li{display:flex;gap:16px;align-items:flex-start;padding:14px 0;border-top:1px solid var(--greige-300);} .anno-list li:last-child{border-bottom:1px solid var(--greige-300);} .anno-list .n{flex:none;width:24px;height:24px;border-radius:50%;border:1px solid var(--black);color:var(--black);font-family:var(--mono);font-size:10.5px;display:flex;align-items:center;justify-content:center;margin-top:1px;} .anno-list b{display:block;font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:13.5px;letter-spacing:.02em;color:var(--black);margin-bottom:3px;} .anno-list p{font-size:14px;line-height:1.55;color:var(--ink-soft);margin:0;} .contents{display:grid;grid-template-columns:repeat(4,1fr);margin-top:72px;border-top:1px solid var(--greige-300);} .contents>div{padding:30px 32px 0;border-right:1px solid var(--greige-300);} .contents>div:first-child{padding-left:0;} .contents>div:last-child{border-right:0;padding-right:0;} .contents .k{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:12px;} .contents h4{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:16px;color:var(--black);margin:0 0 10px;} .contents p{font-size:14.5px;line-height:1.65;color:var(--ink-soft);margin:0;text-wrap:pretty;} @media (pointer:coarse) and (max-width:960px){ .anno{grid-template-columns:1fr;gap:32px;} .contents{grid-template-columns:1fr 1fr;row-gap:26px;} .contents>div{padding:0 24px 0 0;border-right:0;} .contents>div:nth-child(odd){border-right:1px solid var(--greige-300);} .contents>div:nth-child(even){padding:0 0 0 24px;} } @media (pointer:coarse) and (max-width:560px){ .contents{grid-template-columns:1fr;} .contents>div,.contents>div:nth-child(odd),.contents>div:nth-child(even){padding:0;border-right:0;} } #howworks .sec-head-cta{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;} #howworks .sec-head-cta .btn{flex:none;} @media (pointer:coarse) and (max-width:700px){ #howworks .sec-head-cta{flex-direction:column;align-items:flex-start;} } #howmade .sec-head{margin-bottom:87px;} .contents p{min-height:calc(1.65em*3);} /* footer service strip (option E) */ .foot-svc{background:var(--chalk);border-top:1px solid var(--hair);} .foot-svc .container{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));} .foot-svc .it{display:flex;align-items:center;gap:16px;padding:34px 28px;border-left:1px solid #D4D4D4;} .foot-svc .it:first-child{border-left:0;padding-left:0;} .foot-svc svg{width:24px;height:24px;flex:none;fill:none;stroke:var(--brass-deep);stroke-width:1.5;} .foot-svc b{display:block;font-family:var(--head);font-weight:400;font-size:15px;color:var(--ink);} .foot-svc small{display:block;font-size:13.5px;color:var(--ink-soft);margin-top:3px;} .foot-svc small a{color:var(--ink-soft);border-bottom:1px solid transparent;transition:color .15s,border-color .15s;} .foot-svc small a:hover{color:var(--brass-deep);border-bottom-color:var(--brass-deep);} .foot-svc+.foot{border-top:0;} @media (pointer:coarse) and (max-width:900px){ .foot-svc .container{grid-template-columns:1fr 1fr;} .foot-svc .it{padding:24px 18px;} .foot-svc .it:nth-child(odd){border-left:0;padding-left:0;} .foot-svc .it:nth-child(n+3){border-top:1px solid #D4D4D4;} } @media (pointer:coarse) and (max-width:480px){ .foot-svc .container{grid-template-columns:1fr;} .foot-svc .it{border-left:0;padding:18px 0;} .foot-svc .it+.it{border-top:1px solid #D4D4D4;} } /* strip alternates against the last section */ .foot-svc{background:var(--white);} .foot-svc .it{border-left-color:var(--hair);} .sec-white+.foot-svc,.sec-alt+.foot-svc,main.nf+.foot-svc{background:var(--chalk);} .sec-white+.foot-svc .it,.sec-alt+.foot-svc .it,main.nf+.foot-svc .it{border-left-color:#D4D4D4;} /* strip: equal, centred cells with inset dividers */ .foot-svc .it,.foot-svc .it:first-child{justify-content:center;padding:44px 24px;border-left:0;position:relative;} .foot-svc .it+.it::before{content:"";position:absolute;left:0;top:30%;bottom:30%;width:1px;background:var(--greige-300);} .foot-svc .it>div{min-width:0;} @media (pointer:coarse) and (max-width:900px){ .foot-svc .it,.foot-svc .it:first-child{justify-content:flex-start;padding:24px 18px;} .foot-svc .it::before{display:none;} } @media (pointer:coarse) and (max-width:480px){ .foot-svc .it,.foot-svc .it:first-child{padding:18px 0;} } /* strip spans the full container: outer items lock to the footer's left & right edges */ .foot-svc .it:first-child{justify-content:flex-start;padding-left:0;} .foot-svc .it:last-child{justify-content:flex-end;padding-right:0;} @media (pointer:coarse) and (max-width:900px){ .foot-svc .it:last-child{justify-content:flex-start;padding-right:18px;} } @media (pointer:coarse) and (max-width:480px){ .foot-svc .it:last-child{padding-right:0;} } /* footer v2 — group architecture (shared with Trulonge) */ .foot-v2{padding:112px 0 48px;} .foot-v2 .foot-top{grid-template-columns:minmax(0,1.25fr) minmax(0,3fr);gap:64px;padding-bottom:96px;border-bottom:1px solid rgba(255,255,255,.12);} .foot-v2 .foot-line{font-family:var(--head);font-weight:300;font-size:30px;line-height:1.2;letter-spacing:-.01em;color:#F1F1F1;margin:0 0 34px;} .foot-v2 .foot-cols{grid-template-columns:repeat(4,minmax(0,1fr));gap:40px;} .foot-v2 .foot-cols h5{color:rgba(255,255,255,.5);font-size:12px;letter-spacing:.2em;margin-bottom:26px;} .foot-v2 .foot-cols ul{gap:16px;} .foot-v2 .foot-cols li a{font-size:16px;color:rgba(255,255,255,.82);} .foot-v2 .foot-cols li a:hover{color:var(--brass-bright);} .foot-v2 .foot-base{padding-top:34px;} .foot-v2 .foot-mail{color:rgba(255,255,255,.6);transition:color .15s;} .foot-v2 .foot-mail:hover{color:var(--brass);} @media (pointer:coarse) and (max-width:900px){ .foot-v2 .foot-top{grid-template-columns:1fr;gap:52px;padding-bottom:56px;} .foot-v2 .foot-cols{grid-template-columns:1fr 1fr;gap:36px 28px;} } @media (pointer:coarse) and (max-width:760px){ .foot-v2{padding:72px 0 36px;} .foot-v2 .foot-line{font-size:26px;margin-bottom:26px;} .foot-v2 .foot-base{flex-direction:column;align-items:flex-start;gap:10px;} } /* footer v2 refinements: smaller line, larger headings, fading wordmark */ .foot-v2 .foot-line{font-size:24px;line-height:1.25;margin-bottom:30px;} .foot-v2 .foot-cols h5{font-size:13.5px;letter-spacing:.2em;} .foot-v2 .foot-top{border-bottom:0;padding-bottom:0;} .foot-mark{padding:104px 0 64px;} .foot-mark img{display:block;width:100%;height:auto;filter:brightness(0) invert(1);opacity:.42;-webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.08) 100%);mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.08) 100%);pointer-events:none;user-select:none;} .foot-v2 .foot-base{border-top:1px solid rgba(255,255,255,.12);} @media (pointer:coarse) and (max-width:760px){ .foot-v2 .foot-line{font-size:22px;} .foot-mark{padding:56px 0 36px;} } /* wordmark: match Trulonge rhythm + true edge-to-edge (png carries ~3.7% side padding) */ .foot-mark{padding:72px 0 52px;overflow:hidden;} .foot-mark img{width:100%;max-width:100%;margin-left:0;} @media (pointer:coarse) and (max-width:760px){ .foot-mark{padding:44px 0 32px;} } /* strip: four equal columns, every item left-aligned at the same inset after its divider */ .foot-svc .it,.foot-svc .it:first-child,.foot-svc .it:last-child{justify-content:flex-start;padding:44px 0 44px 40px;} .foot-svc .it:first-child{padding-left:0;} @media (pointer:coarse) and (max-width:900px){ .foot-svc .it,.foot-svc .it:first-child,.foot-svc .it:last-child{padding:24px 18px;} .foot-svc .it:nth-child(odd){padding-left:0;} } @media (pointer:coarse) and (max-width:480px){ .foot-svc .it,.foot-svc .it:first-child,.foot-svc .it:last-child{padding:18px 0;} } /* footer tagline a step smaller */ .foot-v2 .foot-line{font-size:20px;} @media (pointer:coarse) and (max-width:760px){ .foot-v2 .foot-line{font-size:19px;} } /* every section spans the same left-to-right edge as the product section */ .manifesto{max-width:none;} .faq{max-width:none;margin-left:0;margin-right:0;} .conv{grid-template-columns:max-content minmax(0,1fr);} .conv .vis{justify-self:end;width:100%;max-height:none;} @media (pointer:coarse) and (max-width:860px){ .conv .vis{justify-self:start;max-width:420px;} } /* wordmark: more air above and below */ .foot-mark{padding:96px 0 80px;} @media (pointer:coarse) and (max-width:760px){ .foot-mark{padding:56px 0 44px;} } #buy,#inside,#howworks{scroll-margin-top:calc(var(--nav-h) + 24px);} /* placeholders: unmistakable for the designer */ .ph{outline:1px dashed rgba(148,124,68,.55);outline-offset:-10px;} .ph::before{content:"Image placeholder";position:absolute;top:18px;left:18px;z-index:1;font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);background:var(--bone);border:1px solid var(--brass-deep);border-radius:999px;padding:5px 10px 5px 24px;line-height:1;white-space:nowrap; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23947C44' stroke-width='2'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Ccircle cx='9' cy='10' r='1.6'/%3E%3Cpath d='M21 16l-5-5-8 8'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:11px;background-position:9px center;} .ph[data-kind="video"]::before{content:"Video placeholder";background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23947C44'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E");} .ph::after{font-size:10px;color:var(--ink);opacity:.8;} .hero-full .bg .ph::before{top:auto;bottom:52px;left:24px;} .hero-full .bg .ph::after{color:var(--bone);opacity:.85;} /* tiny slots: dashed frame only, no badge */ .cart-item .thumb .ph::before,.sum-item .th .ph::before,.gallery .thumbs .t .ph::before,.tcard .av .ph::before,.belief .cap-img .ph::before{display:none;} .cart-item .thumb .ph,.sum-item .th .ph,.gallery .thumbs .t .ph,.tcard .av .ph{outline-offset:-4px;} .tcard .av .ph::after,.cart-item .thumb .ph::after,.sum-item .th .ph::after{font-size:8px;padding:0 4px;max-width:92%;} /* two-line display titles: more air between lines */ .display{line-height:1.08;} .h-xl{line-height:1.02;} /* section heads: one consistent rhythm (eyebrow → title → content) */ .sec-head .label,.cta-band .label,.conv .label,.manifesto .label{display:block;line-height:1;margin-bottom:22px;} .sec-head h2,.cta-band h2,.manifesto h2{margin-top:0!important;line-height:1.1;text-wrap:balance;} .sec-head{margin-bottom:64px;} .sec-head .lead{margin-top:22px!important;} .sec-head-cta .label{margin-bottom:22px;} @media (pointer:coarse) and (max-width:760px){ .sec-head{margin-bottom:44px;} .sec-head .label,.cta-band .label,.conv .label,.manifesto .label{margin-bottom:16px;} } /* eyebrows: one step larger sitewide */ .label{font-size:12.5px;letter-spacing:.2em;} @media (pointer:coarse) and (max-width:760px){ .label{font-size:11.5px;} } /* every eyebrow carries the brass dot, like the hero */ .label{display:inline-flex!important;align-items:center;gap:10px;} .label::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brass);flex:none;} .sec-dark .label::before,.foot .label::before{background:var(--brass-bright);} .eyebrow::before{display:none;} .label.eyebrow::before{display:block;} .isq-section-head--center .label,.cta-band .label,.manifesto .label{justify-content:center;} .sec-head.isq-section-head--center .label,.cta-band .label,.manifesto .label{display:flex!important;} /* brass text on light backgrounds: deeper so it stays readable (dots, buttons, lines stay #380E0E) */ :root{--brass-text:#111111;} .label{color:var(--brass-text);} .step .term,.feature .n,.manifesto .mf .k,.faq .q .plus,.sizeref dt,.sizeref .dim,.inside .rail .n,.acct-card label,.stockline b{color:var(--brass-text);} .sec-dark .manifesto .mf .k{color:#F1F1F1;} .nav .center a.active,.nav .center a:hover{color:var(--brass-text);} /* philosophy: image cards */ .sec-dark .manifesto .mf{padding:0;overflow:hidden;display:flex;flex-direction:column;} .manifesto .mimg{aspect-ratio:4/3;overflow:hidden;background:var(--greige-100);} .manifesto .mimg .ph{width:100%;height:100%;border-radius:0;} .manifesto .mbody{padding:36px 38px 44px;} .sec-dark .manifesto .mf .k{margin-bottom:14px;} @media (pointer:coarse) and (max-width:820px){ .manifesto .mbody{padding:28px 26px 34px;} } /* marquee marks in brass */ .marquee .item::after{color:var(--brass);} /* four beliefs: dark cards, arch corners on the outer edge */ .belief-grid{min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;} .bf{min-width:0;background:var(--black);border-radius:16px;padding:48px 52px 60px;min-height:340px;display:flex;flex-direction:column;justify-content:space-between;gap:36px;} .bf .ico{width:72px;height:72px;border-radius:50%;background:var(--brass);display:flex;align-items:center;justify-content:center;flex:none;} .bf .ico svg{width:30px;height:30px;stroke:var(--black);fill:none;stroke-width:1.5;} .bf h3{font-family:var(--head);font-weight:300;text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(22px,2.1vw,30px);line-height:1.08;margin:0 0 16px;color:#F1F1F1;overflow-wrap:anywhere;} .bf p{font-size:clamp(14px,1.1vw,16px);line-height:1.65;margin:0;color:rgba(255,255,255,.72);overflow-wrap:anywhere;} .bf-tl{border-radius:140px 16px 16px 16px;padding-left:100px;} .bf-tr{border-radius:16px 140px 16px 16px;} .bf-bl{border-radius:16px 16px 16px 140px;padding-left:100px;padding-bottom:72px;} .bf-br{border-radius:16px 16px 140px 16px;} @media (pointer:coarse) and (max-width:860px){ .belief-grid{grid-template-columns:1fr;gap:16px;} .bf,.bf-tl,.bf-tr,.bf-bl,.bf-br{min-height:0;padding:34px 28px 38px;border-radius:100px 16px 16px 16px;gap:28px;} .bf .ico{width:60px;height:60px;} .bf h3,.bf p{white-space:normal;} .bf p{font-size:15px;} } /* one-line titles and copy only where the cards are wide enough */ @media (min-width:1200px){ .bf h3,.bf p{white-space:nowrap;} } @media (max-width:1199px){ .bf{padding:40px 36px 48px;min-height:300px;} .bf-tl,.bf-bl{padding-left:72px;} .bf-bl{padding-bottom:56px;} .bf-tl{border-radius:110px 16px 16px 16px;} .bf-tr{border-radius:16px 110px 16px 16px;} .bf-bl{border-radius:16px 16px 16px 110px;} .bf-br{border-radius:16px 16px 110px 16px;} } /* philosophy cards: title a touch stronger, tighter to its copy */ .sec-dark .manifesto .mf .k{font-size:17px;margin-bottom:12px;} /* how it's made: image cards */ .craftcard{padding:0;overflow:hidden;border-radius:14px;display:flex;flex-direction:column;} .craftcard .cimg{aspect-ratio:4/3;background:var(--greige-100);overflow:hidden;} .craftcard .cimg .ph{width:100%;height:100%;border-radius:0;} .craftcard .cbody{padding:34px 34px 40px;} .craftcard h4{font-size:18px;margin-bottom:14px;} .craftcard p{font-size:15px;line-height:1.7;} /* comparison: more room */ .vs{gap:40px;} .vs-col{padding:68px 60px 72px;} .vs-col .vs-h{margin-bottom:48px;} .vs-col ul{gap:32px;} .vs-col li{font-size:16.5px;line-height:1.55;gap:18px;} .vs-col .mk{width:24px;height:24px;} @media (pointer:coarse) and (max-width:760px){ .vs{gap:20px;} .vs-col{padding:44px 30px 48px;} .vs-col .vs-h{margin-bottom:34px;} .vs-col ul{gap:24px;} .craftcard .cbody{padding:26px 24px 30px;} } .nav .center a{white-space:nowrap;} /* four parts: its own section */ .parts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;} .part .pimg{aspect-ratio:4/5;border-radius:12px;overflow:hidden;background:var(--greige-100);margin-bottom:26px;} .part .k{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:12px;} .part h4{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:18px;letter-spacing:.01em;color:var(--black);margin:0 0 12px;} .part p{font-size:15px;line-height:1.65;color:var(--ink-soft);margin:0;text-wrap:pretty;} @media (max-width:1100px){ .parts{grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 28px;} } @media (pointer:coarse) and (max-width:560px){ .parts{grid-template-columns:1fr;gap:40px;} } /* beliefs: identical title height in every card (no zig-zag) */ .bf,.bf-bl{padding-bottom:64px;} @media (max-width:1199px){ .bf,.bf-bl{padding-bottom:48px;} } @media (pointer:coarse) and (max-width:860px){ .bf,.bf-bl{padding-bottom:38px;} } /* comparison: more room between points */ .vs-col ul{gap:44px;} .vs-col li{line-height:1.6;} @media (pointer:coarse) and (max-width:760px){ .vs-col ul{gap:30px;} } /* built to inspire: spaced page cards */ .pstack{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;align-items:stretch;} .pcard{border-radius:14px;padding:48px 38px 56px;min-height:360px;border:1px solid var(--greige-300);box-shadow:0 14px 30px -18px rgba(0,0,0,.25);} .pcard.wh{background:var(--white);} .pcard.cr{background:var(--chalk);border-color:#D4D4D4;} .pcard .ico{width:64px;height:64px;border-radius:50%;background:var(--white);border:1px solid var(--hair);display:flex;align-items:center;justify-content:center;margin-bottom:44px;} .pcard .ico svg{width:26px;height:26px;stroke:var(--black);fill:none;stroke-width:1.5;} .pcard h4{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:17px;letter-spacing:.01em;line-height:1.2;color:var(--black);margin:0 0 16px;} .pcard p{font-size:15px;line-height:1.7;color:var(--ink-soft);margin:0;text-wrap:pretty;} @media (max-width:1100px){ .pstack{grid-template-columns:repeat(2,minmax(0,1fr));} } @media (pointer:coarse) and (max-width:560px){ .pstack{grid-template-columns:1fr;gap:18px;} .pcard{min-height:0;padding:34px 28px 38px;} .pcard .ico{margin-bottom:28px;} } /* built to inspire: overlapping page stack, roomy inside */ .pstack{gap:0;align-items:start;} .pcard{margin-left:-16px;position:relative;} .pcard:first-child{margin-left:0;} .pcard:nth-child(1){z-index:4;} .pcard:nth-child(2){z-index:3;} .pcard:nth-child(3){z-index:2;} .pcard:nth-child(4){z-index:1;} @media (max-width:1100px){ .pstack{gap:28px;} .pcard,.pcard:first-child{margin-left:0;} } @media (pointer:coarse) and (max-width:560px){ .pstack{gap:18px;} } /* the book: front to back, the daily spread is the heart */ .parts{display:grid;grid-template-columns:1fr 1fr 1.55fr 1fr;gap:24px;align-items:stretch;position:relative;margin-top:8px;padding-top:56px;border-top:1px solid var(--black);} .part{position:relative;background:var(--white);border:1px solid var(--greige-300);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;} .part::before{content:"";position:absolute;top:-62px;left:0;width:11px;height:11px;border-radius:50%;background:var(--brass);} .part .pimg{aspect-ratio:auto;height:300px;border-radius:0;margin:0;background:var(--greige-100);} .part .pimg .ph{width:100%;height:100%;border-radius:0;} .part .pbody{padding:30px 28px 36px;} .part .k{margin-bottom:12px;} .part.heart{background:var(--black);border-color:var(--black);} .part.heart .pimg{height:300px;} .part.heart .k{color:var(--brass);} .part.heart h4{color:#F1F1F1;} .part.heart p{color:rgba(255,255,255,.74);} .part.heart::before{width:15px;height:15px;top:-64px;} @media (max-width:1100px){ .parts{grid-template-columns:repeat(2,minmax(0,1fr));border-top:0;padding-top:0;} .part::before{display:none;} .part.heart{grid-column:1/-1;} } @media (pointer:coarse) and (max-width:560px){ .parts{grid-template-columns:1fr;gap:18px;} .part .pimg{height:220px;} } /* how it's made on cream */ #howmade .craftcard{background:var(--white);border:1px solid var(--greige-300);} #howmade .craftcard h4{color:var(--black);} #howmade .craftcard p{color:var(--ink-soft);} #howmade .cimg{background:var(--greige-100);} /* the book as a cross-section: parts sized by how much of the book they are */ .bookbar{display:grid;grid-template-columns:1fr 1fr 2.4fr 1fr;gap:8px;align-items:start;margin-top:12px;} .bpart{display:flex;flex-direction:column;gap:32px;min-width:0;} .bpart .seg{height:150px;border-radius:12px;background:var(--white);border:1px solid var(--greige-300);display:flex;align-items:flex-end;padding:0 26px 24px;} .bpart .seg span{font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--black);display:inline-flex;align-items:center;gap:10px;} .bpart.b0 .seg{border-radius:75px 12px 12px 75px;padding-left:44px;} .bpart.b1 .seg{background:#F1F1F1;border-color:#D4D4D4;} .bpart.heart .seg{background:var(--black);border-color:var(--black);} .bpart.heart .seg span{color:#F1F1F1;} .bpart.heart .seg span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brass);} .bpart.b3 .seg{border-radius:12px 75px 75px 12px;} .bpart .bt{padding:0 22px 0 6px;} .bpart.b0 .bt{padding-left:44px;} .bpart h4{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:18px;letter-spacing:.01em;line-height:1.2;color:var(--black);margin:0 0 12px;} .bpart p{font-size:15px;line-height:1.65;color:var(--ink-soft);margin:0;text-wrap:pretty;} @media (max-width:1100px){ .bookbar{grid-template-columns:1fr 1fr;gap:40px 16px;} .bpart.heart{grid-column:1/-1;order:-1;} .bpart.b0 .seg,.bpart.b3 .seg{border-radius:12px;padding-left:26px;} .bpart.b0 .bt{padding-left:6px;} .bpart .seg{height:96px;} } @media (pointer:coarse) and (max-width:560px){ .bookbar{grid-template-columns:1fr;gap:32px;} .bpart{gap:20px;} .bpart .seg{height:72px;padding-bottom:18px;} } /* the book: open index, hairlines only */ .book-open{display:grid;grid-template-columns:.8fr 1.4fr;gap:96px;align-items:start;} .bo-list{border-top:1px solid var(--black);} .bo-row{display:grid;grid-template-columns:150px 1fr;column-gap:36px;row-gap:10px;padding:34px 0 36px;border-bottom:1px solid var(--greige-300);align-items:baseline;} .bo-row .k{grid-row:1/span 2;font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);padding-top:6px;} .bo-row h4{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:26px;line-height:1.15;letter-spacing:-.005em;color:var(--black);margin:0;} .bo-row p{grid-column:2;font-size:15.5px;line-height:1.65;color:var(--ink-soft);margin:0;max-width:52ch;text-wrap:pretty;} .bo-row.hot h4{font-weight:400;} .bo-row.hot .k{color:var(--brass-deep);display:flex;align-items:flex-start;gap:10px;} .bo-row.hot .k::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brass);margin-top:4px;flex:none;} @media (pointer:coarse) and (max-width:1024px){ .book-open{grid-template-columns:1fr;gap:48px;} } @media (pointer:coarse) and (max-width:640px){ .bo-row{grid-template-columns:1fr;} .bo-row .k{grid-row:auto;padding:0 0 4px;} .bo-row p{grid-column:1;} .bo-row h4{font-size:22px;} } /* the daily spread: an open book in type */ .spread-open{display:grid;grid-template-columns:1fr 1fr;margin-top:72px;border-top:1px solid var(--black);position:relative;} .spread-open::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--greige-300);} .sp-page{padding:0 64px 8px;} .sp-page:first-child{padding-left:0;} .sp-page:last-child{padding-right:0;} .sp-tag{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);padding:26px 0 24px;display:flex;align-items:center;gap:10px;} .sp-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brass);} .sp-row{padding:26px 0 28px;border-top:1px solid var(--hair);} .sp-row h4{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:16px;letter-spacing:.01em;color:var(--black);margin:0 0 8px;} .sp-row p{font-size:15px;line-height:1.65;color:var(--ink-soft);margin:0;text-wrap:pretty;} @media (pointer:coarse) and (max-width:860px){ .spread-open{grid-template-columns:1fr;} .spread-open::before{display:none;} .sp-page,.sp-page:first-child,.sp-page:last-child{padding:0;} .sp-page+.sp-page{margin-top:24px;border-top:1px solid var(--black);} } .pdp>*,.buy{min-width:0;} @media (pointer:coarse) and (max-width:1100px){ .pdp{gap:44px;} } /* comparison: our card on bone, brass only as a hint */ #compare .vs-col.us{background:var(--white);border:1px solid var(--white);} #compare .vs-col.them{background:transparent;border:1px solid rgba(255,255,255,.22);} #compare .vs-col .vs-h{margin-bottom:30px;padding-bottom:26px;border-bottom:1px solid;} #compare .vs-col.us .vs-h{color:var(--black);border-color:var(--greige-300);} #compare .vs-col.them .vs-h{color:rgba(255,255,255,.78);border-color:rgba(255,255,255,.18);} #compare .vs-col .badge{background:transparent;color:var(--ink-soft);border:1px solid var(--greige-300);font-size:9.5px;padding:5px 12px;letter-spacing:.14em;} #compare .vs-col ul{gap:0;} #compare .vs-col li{padding:24px 0;font-size:16px;line-height:1.55;gap:18px;border-top:1px solid;} #compare .vs-col li:first-child{border-top:0;padding-top:4px;} #compare .vs-col li:last-child{padding-bottom:0;} #compare .vs-col.us li{color:var(--black);border-color:var(--greige-100);} #compare .vs-col.them li{color:rgba(255,255,255,.62);border-color:rgba(255,255,255,.12);} #compare .vs-col.us .mk{background:var(--black);color:var(--white);} #compare .vs-col.them .mk{background:transparent;border:1px solid rgba(255,255,255,.3);color:rgba(255,255,255,.6);} /* size: no outlined box. a bone panel, a white A4 sheet, the black cover */ .sizeref .viz{background:var(--bone);border:0;border-radius:20px;min-height:400px;padding:56px 40px 64px;} .sec-chalk .sizeref .viz{border:0;} .sizeref .obj.a4>.box{background:var(--white);border:0;border-radius:2px;box-shadow:0 1px 2px rgba(22,21,16,.08),0 22px 44px -22px rgba(22,21,16,.28);} .sizeref .obj.j .box{border:0;background:var(--black);border-radius:2px 6px 6px 2px;box-shadow:0 14px 28px -12px rgba(22,21,16,.5);} .sizeref .obj.j .box::before{background:rgba(255,255,255,.22);left:11px;} .sizeref .dim{color:var(--ink-soft);} .sizeref .obj .lb2{color:var(--greige-700);} .sizeref dl{margin-top:30px;gap:0 36px;} .sizeref dl>dt,.sizeref dl>dd{border-top:0;} .sizeref dt{color:var(--ink-soft);padding-top:18px;margin:0;border-top:1px solid var(--greige-300);} .sizeref dd{padding:6px 0 18px;} .sizeref dl{grid-template-columns:150px 1fr;} /* how it works: the day, then the week */ .hw-day{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 56px;border-top:1px solid var(--black);padding-top:40px;} .hw-c span{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:56px;} .hw-c:first-child span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brass);} .hw-c h3,.hw-wk h3{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:21px;line-height:1.2;letter-spacing:.005em;color:var(--black);margin:0 0 14px;} .hw-c p,.hw-wk p{font-size:15.5px;line-height:1.7;color:var(--ink-soft);margin:0;text-wrap:pretty;} .hw-wk{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:56px;align-items:start;margin-top:72px;padding-top:44px;border-top:1px solid var(--greige-300);} .hw-wk .k{font-family:var(--head);font-weight:200;text-transform:uppercase;font-size:clamp(34px,4vw,52px);line-height:1;letter-spacing:-.015em;color:var(--black);} .hw-wk p{max-width:52ch;} @media (pointer:coarse) and (max-width:1100px){ .hw-day{grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 48px;} .hw-c span{margin-bottom:28px;} } @media (pointer:coarse) and (max-width:760px){ .hw-day{grid-template-columns:1fr;gap:40px;padding-top:32px;} .hw-wk{grid-template-columns:1fr;gap:18px;margin-top:48px;padding-top:32px;} .hw-wk .k{font-size:34px;} } /* comparison badge: solid brass */ #compare .vs-col .badge{background:var(--brass);color:var(--black);border:0;font-weight:500;} /* the book: four cards with small line drawings */ .pc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:56px;} .pc{background:var(--white);border:1px solid var(--hair);border-radius:22px;padding:36px 34px 44px;display:flex;flex-direction:column;} .pc-k{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);} .pc-viz{height:72px;margin:44px 0 52px;display:flex;align-items:center;} .pc-viz svg{width:100%;height:auto;max-height:64px;} .pc h3{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:26px;line-height:1.1;letter-spacing:-.01em;color:var(--black);margin:0 0 14px;} .pc p{font-size:15.5px;line-height:1.65;color:var(--ink-soft);margin:0;text-wrap:pretty;} @media (pointer:coarse) and (max-width:1100px){ .pc-grid{grid-template-columns:repeat(2,minmax(0,1fr));} } @media (pointer:coarse) and (max-width:640px){ .pc-grid{grid-template-columns:1fr;margin-top:36px;} .pc{padding:30px 28px 34px;} .pc-viz{margin:30px 0 34px;} } /* the daily spread: stepper panel */ .exp{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-top:56px;background:var(--bone);border-radius:26px;overflow:hidden;min-height:540px;} .exp-l{padding:56px 56px 52px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr;align-content:start;} .exp-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:56px;} .exp-k,.exp-n{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);} .exp-k{display:inline-flex;align-items:center;gap:10px;color:var(--black);} .exp-k::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brass);} .sl{grid-row:2;grid-column:1;opacity:0;visibility:hidden;transition:opacity .35s ease;} .sl.on{opacity:1;visibility:visible;} .sl h3{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(28px,3vw,38px);line-height:1.12;letter-spacing:-.012em;color:var(--black);margin:0 0 36px;max-width:14ch;} .sl ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--greige-300);} .sl li{display:grid;grid-template-columns:minmax(0,210px) minmax(0,1fr);gap:24px;padding:20px 0;border-bottom:1px solid var(--greige-300);align-items:baseline;} .sl li b{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:13.5px;letter-spacing:.02em;line-height:1.35;color:var(--black);} .sl li span{font-size:15px;line-height:1.6;color:var(--ink-soft);} .exp-r{position:relative;background:var(--greige-100);min-height:420px;} .im{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .35s ease;} .im.on{opacity:1;visibility:visible;} .im .ph{width:100%;height:100%;border-radius:0;} .exp-b{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;border:1px solid var(--greige-300);background:var(--white);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3;transition:background .2s,border-color .2s;} .exp-b:hover{background:var(--black);border-color:var(--black);} .exp-b svg{width:18px;height:18px;stroke:var(--black);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;} .exp-b:hover svg{stroke:var(--white);} .exp-b.prev{left:20px;} .exp-b.next{right:20px;} @media (pointer:coarse) and (max-width:900px){ .exp{grid-template-columns:1fr;min-height:0;} .exp-l{padding:36px 28px 36px;} .exp-top{margin-bottom:32px;} .sl li{grid-template-columns:1fr;gap:6px;padding:16px 0;} .exp-r{min-height:320px;order:-1;} } /* how it works: arch and five points */ .hwa{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:96px;align-items:center;margin-top:56px;} .hwa-arch{height:600px;border-radius:999px 999px 18px 18px;overflow:hidden;background:var(--greige-100);} .hwa-arch .ph{width:100%;height:100%;border-radius:0;} .hwa-list{border-top:1px solid var(--black);} .hwa-r{display:grid;grid-template-columns:150px minmax(0,1fr);gap:28px;padding:28px 0;border-bottom:1px solid var(--greige-300);} .hwa-r .k{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);padding-top:5px;} .hwa-r:first-child .k{color:var(--black);} .hwa-r h3{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:19px;letter-spacing:.005em;color:var(--black);margin:0 0 8px;} .hwa-r p{font-size:15.5px;line-height:1.65;color:var(--ink-soft);margin:0;max-width:50ch;text-wrap:pretty;} @media (pointer:coarse) and (max-width:1000px){ .hwa{grid-template-columns:1fr;gap:44px;} .hwa-arch{height:440px;max-width:380px;margin:0 auto;width:100%;} } @media (pointer:coarse) and (max-width:640px){ .hwa-r{grid-template-columns:1fr;gap:8px;padding:22px 0;} .hwa-arch{height:360px;} } /* the daily spread: all eight parts, so the depth of the page is visible */ .d8{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:56px;} .d8c{background:var(--bone);border:1px solid var(--greige-100);border-radius:20px;padding:32px 30px 38px;min-height:250px;display:flex;flex-direction:column;} .d8k{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:44px;} .d8k::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brass);flex:none;} .d8c h3{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:17px;line-height:1.25;letter-spacing:.005em;color:var(--black);margin:0 0 12px;} .d8c p{font-size:15px;line-height:1.65;color:var(--ink-soft);margin:0;text-wrap:pretty;} @media (pointer:coarse) and (max-width:1100px){ .d8{grid-template-columns:repeat(2,minmax(0,1fr));} } @media (pointer:coarse) and (max-width:640px){ .d8{grid-template-columns:1fr;margin-top:36px;} .d8c{min-height:0;padding:26px 24px 30px;} .d8k{margin-bottom:26px;} } /* daily spread: panel with stepper, four phases */ .xp{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-top:56px;background:var(--bone);border-radius:28px;overflow:hidden;min-height:560px;} .xp-l{display:grid;grid-template-columns:minmax(0,1fr);align-items:center;padding:56px 60px;} .xs{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .35s ease;} .xs.on{opacity:1;visibility:visible;} .xn{font-family:var(--head);font-weight:200;font-size:clamp(72px,8vw,112px);line-height:.9;letter-spacing:-.03em;color:var(--brass);margin-bottom:44px;} .xs h3{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(26px,2.6vw,34px);line-height:1.12;letter-spacing:-.012em;color:var(--black);margin:0 0 30px;max-width:15ch;padding-bottom:30px;border-bottom:1px solid var(--greige-300);} .xs ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px;} .xs li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:14px;align-items:baseline;} .xs li i{font-style:normal;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--black);} .xs li span{font-size:15.5px;line-height:1.6;color:var(--ink-soft);} .xs li b{font-weight:600;color:var(--black);} .xp-r{position:relative;background:var(--greige-100);min-height:420px;} .xi{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .35s ease;} .xi.on{opacity:1;visibility:visible;} .xi .ph{width:100%;height:100%;border-radius:0;} .xb{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;border:1px solid var(--greige-300);background:var(--white);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3;transition:background .2s,border-color .2s;} .xb:hover{background:var(--black);border-color:var(--black);} .xb svg{width:18px;height:18px;stroke:var(--black);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;} .xb:hover svg{stroke:var(--white);} .xb.prev{left:20px;} .xb.next{right:20px;} @media (pointer:coarse) and (max-width:900px){ .xp{grid-template-columns:1fr;min-height:0;} .xp-r{order:-1;min-height:300px;} .xp-l{padding:34px 26px 38px;} .xn{margin-bottom:26px;font-size:72px;} .xs h3{margin-bottom:22px;padding-bottom:22px;} } /* size on cream: white panel, paper sheet in bone */ .sec-chalk .sizeref .viz{background:var(--white);} .sec-chalk .sizeref .obj.a4>.box{background:var(--bone);} .xs .xt{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:18px;} .xs .xt::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brass);flex:none;} .xs p{font-size:17px;line-height:1.65;color:var(--ink-soft);margin:0;max-width:34ch;text-wrap:pretty;} .xs h3{margin-bottom:18px;max-width:none;} .sec-chalk .xp{background:var(--white);} .pc h3{font-size:22px;white-space:nowrap;} .pc-viz svg{overflow:visible;} .xp{background:var(--chalk);} .tcard .av{background:var(--chalk);border:1px solid var(--brass);display:flex;align-items:center;justify-content:center;} .tcard .av span{font-family:var(--head);font-weight:300;font-size:34px;line-height:1;color:var(--black);text-transform:uppercase;} .tcard .av span{font-size:28px;letter-spacing:.06em;} .tcard .av{background:linear-gradient(145deg,#F1F1F1 0%,#E4D2A4 55%,#380E0E 100%);border:0;} .tcard .av span{font-size:34px;letter-spacing:0;} /* ---- page: 404.html ---- */ :where(.isq-page--not-found) .nf{min-height:calc(100vh - var(--nav-h));display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:80px 24px;} :where(.isq-page--not-found) .nf .big{font-family:var(--head);font-weight:300;font-size:clamp(96px,22vw,260px);line-height:.86;letter-spacing:-.03em;color:var(--black);} :where(.isq-page--not-found) .nf .big .dot{color:var(--brass);} :where(.isq-page--not-found) .nf .label{margin:6px 0 18px;} :where(.isq-page--not-found) .nf h1{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(24px,3.4vw,38px);letter-spacing:-.01em;color:var(--black);margin-bottom:14px;} :where(.isq-page--not-found) .nf p{font-size:16px;color:var(--ink-soft);line-height:1.65;max-width:46ch;margin:0 auto 32px;} :where(.isq-page--not-found) .nf .links{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;} :where(.isq-page--not-found) .nf .quick{margin-top:40px;display:flex;gap:22px;flex-wrap:wrap;justify-content:center;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;} :where(.isq-page--not-found) .nf .quick a{color:var(--ink-soft);border-bottom:1px solid var(--hair);padding-bottom:3px;transition:color .15s,border-color .15s;} :where(.isq-page--not-found) .nf .quick a:hover{color:var(--black);border-color:var(--brass);} /* ---- page: shop.html ---- */ :where(.isq-page--shop) .shop-head{text-align:center;max-width:620px;margin:0 auto 56px;} :where(.isq-page--shop) .coll{max-width:600px;margin:0 auto;grid-template-columns:repeat(2,1fr);} :where(.isq-page--shop) .shop-head h1{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(36px,5vw,66px);letter-spacing:-.02em;color:var(--black);line-height:1;} :where(.isq-page--shop) .shop-head p{font-size:16px;color:var(--ink-soft);margin-top:16px;line-height:1.6;} /* featured banner */ :where(.isq-page--shop) .grid3-shop{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-bottom:clamp(72px,9vw,120px);} :where(.isq-page--shop) .prod .pr{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--ink-soft);margin-top:6px;} @media (pointer:coarse) and (max-width:760px){ :where(.isq-page--shop) .grid3-shop{grid-template-columns:1fr;} } :where(.isq-page--shop) .feat-shop{display:grid;grid-template-columns:1.05fr .95fr;gap:0;border:1px solid var(--hair);border-radius:16px;overflow:hidden;margin-bottom:64px;background:var(--white);} :where(.isq-page--shop) .feat-shop .vis{position:relative;min-height:420px;background:var(--chalk);} :where(.isq-page--shop) .feat-shop .vis .ph{position:absolute;inset:0;} :where(.isq-page--shop) .feat-shop .panel{padding:54px 50px;display:flex;flex-direction:column;justify-content:center;} :where(.isq-page--shop) .feat-shop .tag{display:inline-block;width:max-content;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-deep);background:transparent;border:1px solid var(--brass-deep);padding:5px 12px;border-radius:100px;margin-bottom:18px;} :where(.isq-page--shop) .feat-shop h2{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(28px,3.4vw,44px);letter-spacing:-.02em;line-height:1;color:var(--black);margin-bottom:14px;} :where(.isq-page--shop) .feat-shop .price{font-family:var(--head);font-weight:300;font-size:30px;color:var(--brass-deep);margin-bottom:6px;} :where(.isq-page--shop) .feat-shop .price small{font-size:17px;color:var(--greige-500);text-decoration:line-through;margin-left:10px;} :where(.isq-page--shop) .feat-shop p{font-size:15px;color:var(--ink-soft);line-height:1.65;max-width:42ch;margin:10px 0 26px;} :where(.isq-page--shop) .feat-shop .row{display:flex;gap:28px;flex-wrap:wrap;align-items:center;} :where(.isq-page--shop) .tlink{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--black);border-bottom:1px solid var(--greige-300);padding:6px 0;display:inline-flex;gap:8px;align-items:center;transition:border-color .2s,color .2s;} :where(.isq-page--shop) .tlink:hover{color:var(--brass-deep);border-color:var(--brass-deep);} @media (pointer:coarse) and (max-width:860px){ :where(.isq-page--shop) .feat-shop{grid-template-columns:1fr;} :where(.isq-page--shop) .feat-shop .vis{min-height:300px;} } :where(.isq-page--shop) .coll-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:30px;} :where(.isq-page--shop) .coll-head .label{margin-bottom:0;} :where(.isq-page--shop) .coll-head .count{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);} :where(.isq-page--shop) .soon .img{position:relative;} :where(.isq-page--shop) .soon .img::before{content:"Coming soon";position:absolute;top:12px;left:12px;z-index:2;font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);background:rgba(246,243,235,.92);padding:5px 10px;border-radius:100px;} :where(.isq-page--shop) .soon{opacity:.72;pointer-events:none;} /* more-coming panel */ :where(.isq-page--shop) .more-panel{position:relative;border:1px solid var(--hair);border-radius:16px;overflow:hidden;background:var(--chalk);display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:0;} :where(.isq-page--shop) .more-panel .mc-text{padding:clamp(40px,5vw,64px);} :where(.isq-page--shop) .more-panel .mc-form{padding:clamp(40px,5vw,64px);border-left:1px solid var(--hair);} :where(.isq-page--shop) .more-panel .label{color:var(--brass-deep);margin-bottom:16px;} :where(.isq-page--shop) .more-panel h3{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(26px,3vw,40px);letter-spacing:-.015em;color:var(--black);margin-bottom:18px;line-height:1.02;} :where(.isq-page--shop) .more-panel p{font-size:15px;color:var(--ink-soft);line-height:1.7;max-width:52ch;margin:0;} :where(.isq-page--shop) .mc-form .mc-cap{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:14px;display:block;} :where(.isq-page--shop) .more-form{display:flex;flex-direction:column;gap:10px;max-width:340px;} :where(.isq-page--shop) .more-form input{border:1px solid var(--greige-300);outline:none;background:var(--white);font-family:var(--sans);font-size:15px;padding:15px 18px;color:var(--ink);border-radius:8px;} :where(.isq-page--shop) .more-form input:focus{border-color:var(--brass-deep);} :where(.isq-page--shop) .more-form button{background:var(--black);color:var(--bone);border:0;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;padding:15px;cursor:pointer;border-radius:8px;transition:filter .15s;} :where(.isq-page--shop) .more-form button:hover{filter:brightness(1.5);} @media (pointer:coarse) and (max-width:760px){ :where(.isq-page--shop) .more-panel{grid-template-columns:1fr;width:100%;margin-left:0;} :where(.isq-page--shop) .more-panel .mc-form{border-left:0;border-top:1px solid var(--hair);padding-top:0;} :where(.isq-page--shop) .more-form{max-width:none;} } :where(.isq-page--shop) .feat-shop{margin-bottom:0;} :where(.isq-page--shop) .more-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:end;} :where(.isq-page--shop) .more-sec .mc-text .label{margin-bottom:22px;} :where(.isq-page--shop) .more-sec .mc-text h2{line-height:1.1;margin:0;max-width:14ch;text-wrap:balance;} :where(.isq-page--shop) .more-sec .mc-form{padding:0;border:0;} :where(.isq-page--shop) .more-sec .mc-form p{font-size:16px;color:var(--ink-soft);line-height:1.7;max-width:46ch;margin:0 0 28px;} :where(.isq-page--shop) .more-sec .more-form{flex-direction:row;max-width:520px;gap:10px;} :where(.isq-page--shop) .more-sec .more-form input{flex:1;min-width:0;border:1px solid var(--greige-300);background:var(--white);border-radius:2px;padding:15px 18px;} :where(.isq-page--shop) .more-sec .more-form button{background:#380E0E;color:var(--black);padding:15px 26px;border-radius:2px;flex:none;font-weight:500;} :where(.isq-page--shop) .more-sec .more-form button:hover{filter:none;} @media (pointer:coarse) and (max-width:480px){ :where(.isq-page--shop) .more-sec .more-form{flex-direction:column;} :where(.isq-page--shop) .more-sec .more-form button{width:100%;} } @media (pointer:coarse) and (max-width:760px){ :where(.isq-page--shop) .more-grid{grid-template-columns:1fr;gap:24px;} } /* ---- page: journal.html ---- */ :where(.isq-page--journal) .pdp{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:60px;padding-top:56px;align-items:start;} :where(.isq-page--journal) .gallery{position:sticky;top:96px;} :where(.isq-page--journal) .gallery .main{aspect-ratio:.86;border-radius:8px;overflow:hidden;background:var(--chalk);margin-bottom:14px;} :where(.isq-page--journal) .gallery .main .ph{width:100%;height:100%;} :where(.isq-page--journal) .gallery .thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;} :where(.isq-page--journal) .gallery .thumbs .t{aspect-ratio:1;border-radius:5px;overflow:hidden;background:var(--chalk);cursor:pointer;border:1px solid transparent;transition:border-color .2s;} :where(.isq-page--journal) .gallery .thumbs .t.active,:where(.isq-page--journal) .gallery .thumbs .t:hover{border-color:var(--brass-deep);} :where(.isq-page--journal) .gallery .thumbs .t .ph{width:100%;height:100%;} :where(.isq-page--journal) .buy .label{display:inline-block;margin-bottom:14px;} :where(.isq-page--journal) .buy h1{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(32px,4vw,52px);letter-spacing:-.02em;line-height:1;color:var(--black);margin-bottom:14px;} :where(.isq-page--journal) .buy .rate{display:flex;align-items:center;gap:10px;margin-bottom:18px;} :where(.isq-page--journal) .buy .rate .stars{color:var(--brass);letter-spacing:2px;} :where(.isq-page--journal) .buy .rate span{font-size:13px;color:var(--ink-soft);} :where(.isq-page--journal) .buy .price{font-family:var(--head);font-weight:300;font-size:32px;color:var(--black);margin-bottom:22px;} :where(.isq-page--journal) .buy .price small{font-size:14px;color:var(--greige-500);text-decoration:line-through;margin-left:10px;} :where(.isq-page--journal) .buy .desc{font-size:16px;color:var(--ink-soft);line-height:1.66;margin-bottom:26px;} :where(.isq-page--journal) .buy .opts{margin-bottom:24px;} :where(.isq-page--journal) .buy .opts .ttl{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:10px;} :where(.isq-page--journal) .buy .swatches{display:flex;gap:12px;} :where(.isq-page--journal) .buy .sw{display:flex;align-items:center;gap:9px;border:1px solid var(--greige-300);border-radius:100px;padding:9px 16px;cursor:pointer;font-size:13px;font-weight:500;color:var(--ink);transition:border-color .2s;} :where(.isq-page--journal) .buy .sw.active{border-color:var(--black);} :where(.isq-page--journal) .buy .sw .dot{width:14px;height:14px;border-radius:50%;} :where(.isq-page--journal) .buy .actions{display:flex;gap:14px;align-items:center;margin-bottom:14px;} :where(.isq-page--journal) .buy .qty{display:flex;align-items:center;border:1px solid var(--greige-300);border-radius:2px;} :where(.isq-page--journal) .buy .qty button{background:none;border:0;width:42px;height:48px;font-size:18px;cursor:pointer;color:var(--ink);} :where(.isq-page--journal) .buy .qty span{width:34px;text-align:center;font-variant-numeric:tabular-nums;font-weight:600;} :where(.isq-page--journal) .buy .btn.big{flex:1;justify-content:center;padding:17px 26px;font-size:12px;} :where(.isq-page--journal) .buy .ship{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--ink-soft);text-transform:uppercase;margin-bottom:26px;} :where(.isq-page--journal) .trust{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;border-top:1px solid var(--hair);padding-top:24px;} :where(.isq-page--journal) .trust .t{text-align:center;} :where(.isq-page--journal) .trust .t svg{width:24px;height:24px;stroke:var(--brass-deep);fill:none;stroke-width:1.5;margin-bottom:8px;} :where(.isq-page--journal) .trust .t span{display:block;font-size:11.5px;color:var(--ink-soft);line-height:1.4;} :where(.isq-page--journal) .specrow{display:flex;flex-wrap:wrap;border-top:1px solid var(--hair);margin-top:24px;} :where(.isq-page--journal) .specrow .s{flex:1;min-width:110px;padding:16px 22px;border-right:1px solid var(--hair);} :where(.isq-page--journal) .specrow .s:first-child{padding-left:0;} :where(.isq-page--journal) .specrow .s:last-child{border-right:none;padding-right:0;} :where(.isq-page--journal) .specrow .k{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:5px;} :where(.isq-page--journal) .specrow .v{font-size:13px;color:var(--ink);font-weight:500;} /* comparison */ :where(.isq-page--journal) .compare{max-width:860px;margin:0 auto;border:1px solid var(--hair);border-radius:12px;overflow:hidden;background:var(--white);} :where(.isq-page--journal) .compare .crow{display:grid;grid-template-columns:1.3fr 1fr 1fr;} :where(.isq-page--journal) .compare .crow+.crow{border-top:1px solid var(--hair);} :where(.isq-page--journal) .compare .crow>div{padding:18px 22px;font-size:14px;display:flex;align-items:center;} :where(.isq-page--journal) .compare .crow .feat{color:var(--ink);font-weight:500;} :where(.isq-page--journal) .compare .crow .us{background:var(--chalk);color:var(--black);font-weight:500;justify-content:center;text-align:center;} :where(.isq-page--journal) .compare .crow .them{color:var(--greige-500);justify-content:center;text-align:center;} :where(.isq-page--journal) .compare .head>div{font-family:var(--head);text-transform:uppercase;font-size:13px;letter-spacing:.04em;font-weight:500;padding:18px 22px;} :where(.isq-page--journal) .compare .head .us{background:var(--black);color:var(--bone);} :where(.isq-page--journal) .check{color:var(--brass-deep);} /* vs comparison (dark) */ :where(.isq-page--journal) .vs{display:grid;grid-template-columns:1fr 1fr;gap:32px;} :where(.isq-page--journal) .vs-lead{max-width:46ch;margin:26px auto 0;color:rgba(255,255,255,.72);} :where(.isq-page--journal) #compare{padding:clamp(96px,12vw,168px) 0;} :where(.isq-page--journal) #compare .sec-head{margin-bottom:76px;} :where(.isq-page--journal) .vs-col{border-radius:16px;padding:52px 48px 56px;position:relative;} :where(.isq-page--journal) .vs-col.us{background:rgba(56,14,14,.1);border:1px solid var(--brass-deep);} :where(.isq-page--journal) .vs-col.them{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.14);} :where(.isq-page--journal) .vs-col .vs-h{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:20px;letter-spacing:.01em;margin-bottom:34px;display:flex;align-items:center;justify-content:space-between;} :where(.isq-page--journal) .vs-col.us .vs-h{color:var(--brass-bright);} :where(.isq-page--journal) .vs-col.them .vs-h{color:rgba(255,255,255,.7);} :where(.isq-page--journal) .vs-col .badge{font-family:var(--mono);font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;background:var(--brass);color:var(--black);padding:4px 9px;border-radius:100px;} :where(.isq-page--journal) .vs-col ul{list-style:none;display:flex;flex-direction:column;gap:22px;} :where(.isq-page--journal) .vs-col li{display:flex;gap:16px;align-items:flex-start;font-size:15.5px;line-height:1.5;} :where(.isq-page--journal) .vs-col.us li{color:#F1F1F1;} :where(.isq-page--journal) .vs-col.them li{color:rgba(255,255,255,.55);} :where(.isq-page--journal) .vs-col .mk{flex:none;width:21px;height:21px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:11px;margin-top:1px;} :where(.isq-page--journal) .vs-col.us .mk{background:var(--brass);color:var(--black);} :where(.isq-page--journal) .vs-col.them .mk{background:rgba(255,255,255,.12);color:rgba(255,255,255,.6);} @media (pointer:coarse) and (max-width:760px){ :where(.isq-page--journal) .vs{grid-template-columns:1fr;} :where(.isq-page--journal) .vs-col{padding:36px 30px 40px;} } @media (pointer:coarse) and (max-width:980px){ :where(.isq-page--journal) .pdp{grid-template-columns:minmax(0,1fr);gap:36px;} :where(.isq-page--journal) .gallery{position:static;} } /* ---- page: about.html ---- */ :where(.isq-page--about) .who{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(40px,6vw,96px);align-items:start;} :where(.isq-page--about) .who-h{font-size:clamp(30px,3.6vw,50px);line-height:1.02;text-wrap:balance;max-width:16ch;} :where(.isq-page--about) .who-r .lead{margin-bottom:34px;} :where(.isq-page--about) .who-facts{display:grid;grid-template-columns:1fr 1fr;gap:22px 28px;border-top:1px solid var(--greige-300);padding-top:26px;margin:0;} :where(.isq-page--about) .who-facts dt{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:6px;} :where(.isq-page--about) .who-facts dd{margin:0;font-size:14.5px;color:var(--ink);} :where(.isq-page--about) .story{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--greige-300);border-bottom:1px solid var(--greige-300);} :where(.isq-page--about) .beat{display:block;padding:44px 40px 48px;border-right:1px solid var(--greige-300);} :where(.isq-page--about) .beat:first-child{padding-left:0;} :where(.isq-page--about) .beat:last-child{border-right:0;padding-right:0;} :where(.isq-page--about) .beat-n{font-family:var(--head);font-weight:300;font-size:44px;color:var(--brass);line-height:1;margin:0 0 26px;} :where(.isq-page--about) .beat h3{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:17px;letter-spacing:.02em;color:var(--black);margin:0 0 14px;line-height:1.2;} :where(.isq-page--about) .beat p{font-size:15.5px;line-height:1.72;color:var(--ink-soft);margin:0;text-wrap:pretty;} :where(.isq-page--about) .beat p .lift{color:var(--brass-deep);font-weight:600;} :where(.isq-page--about) .pull-wide{font-family:var(--head);font-weight:300;font-size:clamp(26px,3.4vw,44px);line-height:1.2;letter-spacing:-.01em;color:var(--black);text-align:center;max-width:26ch;margin:56px auto 0;padding:0;border:0;text-wrap:balance;} @media (pointer:coarse) and (max-width:900px){ :where(.isq-page--about) .who,:where(.isq-page--about) .story{grid-template-columns:1fr;} :where(.isq-page--about) .beat{border-right:0;border-bottom:1px solid var(--greige-300);padding:32px 0;} :where(.isq-page--about) .beat:last-child{border-bottom:0;} :where(.isq-page--about) .who-h{max-width:none;} } :where(.isq-page--about) .pull{font-family:var(--head);font-weight:300;font-size:clamp(24px,3vw,34px);line-height:1.32;color:var(--black);letter-spacing:-.01em;border-left:2px solid var(--brass);padding-left:26px;margin:28px 0;} :where(.isq-page--about) .legacy{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center;} :where(.isq-page--about) .legacy .vis{aspect-ratio:1;border-radius:6px;overflow:hidden;} :where(.isq-page--about) .legacy .vis .ph{width:100%;height:100%;} :where(.isq-page--about) .legacy .txt-col{max-width:46ch;} :where(.isq-page--about) .legacy h3{font-family:var(--head);font-weight:500;font-size:22px;color:var(--black);margin-bottom:8px;} :where(.isq-page--about) .legacy .r{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:20px;} :where(.isq-page--about) .legacy p{font-size:15.5px;color:var(--ink-soft);line-height:1.7;margin-bottom:16px;} :where(.isq-page--about) .road{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;} :where(.isq-page--about) .road .item{border:1px solid var(--hair);border-radius:10px;padding:30px;background:var(--chalk);} :where(.isq-page--about) .road .no{font-family:var(--head);font-weight:300;font-size:38px;color:var(--brass);line-height:1;} :where(.isq-page--about) .road h4{font-family:var(--head);font-weight:500;font-size:18px;color:var(--black);margin:14px 0 8px;} :where(.isq-page--about) .road p{font-size:14px;color:var(--ink-soft);line-height:1.6;} :where(.isq-page--about) .road .now{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);margin-top:24px;padding-top:18px;border-top:1px solid var(--hair);width:100%;} :where(.isq-page--about) .road .now::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--brass-deep);flex:none;} :where(.isq-page--about) .sec-dark .road .item{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.16);} :where(.isq-page--about) .sec-dark .road h4{color:#F1F1F1;} :where(.isq-page--about) .sec-dark .road p{color:rgba(255,255,255,.7);} :where(.isq-page--about) .sec-dark .road .now{color:rgba(255,255,255,.85);border-color:rgba(255,255,255,.16);} :where(.isq-page--about) .sec-dark .road .now::before{background:var(--brass);} @media (pointer:coarse) and (max-width:980px){ :where(.isq-page--about) .legacy,:where(.isq-page--about) .road{grid-template-columns:1fr;} } :where(.isq-page--about) .belief{text-align:center;max-width:900px;} :where(.isq-page--about) .belief .cap-img{width:220px;height:110px;border-radius:999px;overflow:hidden;margin:0 auto 40px;} :where(.isq-page--about) .belief .cap-img .ph{width:100%;height:100%;} :where(.isq-page--about) .belief-q{font-family:var(--head);font-weight:300;font-size:clamp(28px,3.6vw,48px);line-height:1.18;letter-spacing:-.015em;color:var(--black);text-wrap:balance;margin:0 auto;max-width:22ch;} :where(.isq-page--about) .belief-q span{color:var(--brass-deep);} /* ---- page: contact.html ---- */ :where(.isq-page--contact) .contact-hero{text-align:center;padding:clamp(70px,10vw,120px) 0 0;} :where(.isq-page--contact) .contact-hero h1{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(40px,6vw,88px);letter-spacing:-.02em;line-height:.98;color:var(--black);} :where(.isq-page--contact) .contact-hero p{font-size:18px;color:var(--ink-soft);max-width:48ch;margin:20px auto 0;line-height:1.6;} :where(.isq-page--contact) .cwrap{display:grid;grid-template-columns:1fr 1.2fr;gap:64px;align-items:start;} :where(.isq-page--contact) .cinfo .blk{border-top:1px solid var(--hair);padding:26px 0;} :where(.isq-page--contact) .cinfo .blk:last-child{border-bottom:1px solid var(--hair);} :where(.isq-page--contact) .cinfo .k{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:10px;} :where(.isq-page--contact) .cinfo .v{font-family:var(--head);font-weight:300;font-size:22px;color:var(--black);letter-spacing:-.01em;} :where(.isq-page--contact) .cinfo .v a{border-bottom:1px solid var(--brass);padding-bottom:2px;} :where(.isq-page--contact) .cinfo .small{font-size:14px;color:var(--ink-soft);line-height:1.6;margin-top:6px;} :where(.isq-page--contact) .cform{background:var(--white);border:1px solid var(--hair);border-radius:14px;padding:40px;} :where(.isq-page--contact) .cform .grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;} :where(.isq-page--contact) .field{display:flex;flex-direction:column;gap:8px;margin-bottom:18px;} :where(.isq-page--contact) .field.full{grid-column:1/-1;} :where(.isq-page--contact) .field label{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-deep);} :where(.isq-page--contact) .field input,:where(.isq-page--contact) .field select,:where(.isq-page--contact) .field textarea{font-family:var(--sans);font-size:15px;color:var(--ink);background:var(--bone);border:1px solid var(--greige-300);border-radius:4px;padding:13px 15px;outline:none;transition:border-color .2s;} :where(.isq-page--contact) .field input:focus,:where(.isq-page--contact) .field select:focus,:where(.isq-page--contact) .field textarea:focus{border-color:var(--brass-deep);} :where(.isq-page--contact) .field select{appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-right:40px;background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%208'%3E%3Cpath%20d='M1%201l5%205%205-5'%20fill='none'%20stroke='%23947C44'%20stroke-width='1.5'%20stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 15px center;background-size:11px;} :where(.isq-page--contact) .field textarea{resize:vertical;min-height:130px;} :where(.isq-page--contact) .cform .btn{width:100%;justify-content:center;margin-top:6px;} :where(.isq-page--contact) .cform .ok{display:none;text-align:center;padding:30px 0;} :where(.isq-page--contact) .cform.sent .ok{display:block;} :where(.isq-page--contact) .cform.sent form{display:none;} :where(.isq-page--contact) .cform .ok h3{font-family:var(--head);font-weight:300;font-size:26px;color:var(--black);margin-bottom:8px;} :where(.isq-page--contact) .cform .ok p{color:var(--ink-soft);font-size:15px;} @media (pointer:coarse) and (max-width:860px){ :where(.isq-page--contact) .cwrap{grid-template-columns:1fr;gap:36px;} :where(.isq-page--contact) .cform{padding:28px;} :where(.isq-page--contact) .cform .grid{grid-template-columns:1fr;} } /* ---- pages: legal (privacy, terms, shipping, returns), shared ---- */ :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal-hero{background:var(--black);color:#F1F1F1;padding:70px 0 56px;border-bottom:2px solid var(--brass);} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal-hero .label{color:var(--brass);} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal-hero h1{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(34px,5vw,64px);letter-spacing:-.02em;color:#F1F1F1;line-height:1;margin-top:14px;} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal-hero .upd{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-top:18px;} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal{max-width:1040px;margin:0 auto;} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal .toc{background:var(--chalk);border:1px solid var(--hair);border-radius:12px;padding:28px 32px;margin-bottom:40px;} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal .toc h4{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:16px;} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal .toc ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px 24px;} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal .toc .n{font-family:var(--mono);font-size:12px;color:var(--brass-deep);font-weight:500;margin-right:10px;} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal .toc a{font-size:14px;color:var(--ink);} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal .toc a:hover{color:var(--brass-deep);} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal section{padding:40px 0;border-top:1px solid var(--hair);} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal h2{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:21px;letter-spacing:-.01em;color:var(--black);margin-bottom:16px;display:flex;gap:12px;align-items:center;} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal h2 .n{font-family:var(--mono);font-size:13px;color:var(--brass-deep);font-weight:500;} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal p{font-size:17px;color:var(--ink);line-height:1.74;margin-bottom:14px;} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal>p{margin-bottom:40px;} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal ul{margin:0 0 14px;padding-left:22px;} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal li{font-size:17px;color:var(--ink);line-height:1.74;margin-bottom:7px;} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal a.inline{color:var(--black);border-bottom:1px solid var(--brass);} :where(.isq-page--privacy,.isq-page--terms,.isq-page--shipping,.isq-page--returns) .legal .note{font-size:13.5px;color:var(--ink-soft);background:var(--chalk);border-left:2px solid var(--brass);padding:18px 22px;border-radius:0 8px 8px 0;margin-top:34px;} /* ---- page: privacy.html ---- */ @media (pointer:coarse) and (max-width:600px){ :where(.isq-page--privacy) .legal .toc ol{grid-template-columns:1fr;} } /* ---- page: terms.html ---- */ @media (pointer:coarse) and (max-width:600px){ :where(.isq-page--terms) .legal .toc ol{grid-template-columns:1fr;} } /* ---- page: shipping.html ---- */ /* shipping rate table */ :where(.isq-page--shipping) .ship-table{width:100%;border-collapse:collapse;margin:6px 0 18px;font-size:14.5px;} :where(.isq-page--shipping) .ship-table th,:where(.isq-page--shipping) .ship-table td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--hair);} :where(.isq-page--shipping) .ship-table thead th{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--brass-deep);font-weight:500;border-bottom:1px solid var(--greige-300);} :where(.isq-page--shipping) .ship-table td{color:var(--ink);} :where(.isq-page--shipping) .ship-table td:last-child{font-variant-numeric:tabular-nums;} :where(.isq-page--shipping) .ship-table tr:last-child td{border-bottom:0;} @media (pointer:coarse) and (max-width:600px){ :where(.isq-page--shipping) .legal .toc ol{grid-template-columns:1fr;} :where(.isq-page--shipping) .ship-table th,:where(.isq-page--shipping) .ship-table td{padding:11px 10px;} } /* ---- page: returns.html ---- */ /* steps */ :where(.isq-page--returns) .ret-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:8px 0 20px;} :where(.isq-page--returns) .ret-steps .rs{border:1px solid var(--hair);border-radius:12px;padding:22px 20px;background:var(--chalk);} :where(.isq-page--returns) .ret-steps .rs .no{font-family:var(--head);font-weight:300;font-size:30px;color:var(--brass);line-height:1;margin-bottom:10px;} :where(.isq-page--returns) .ret-steps .rs h5{font-family:var(--sans);font-weight:600;font-size:14px;color:var(--black);margin-bottom:6px;} :where(.isq-page--returns) .ret-steps .rs p{font-size:13.5px;color:var(--ink-soft);line-height:1.6;margin:0;} @media (pointer:coarse) and (max-width:600px){ :where(.isq-page--returns) .legal .toc ol{grid-template-columns:1fr;} :where(.isq-page--returns) .ret-steps{grid-template-columns:1fr;} } /* ---- page: track.html ---- */ :where(.isq-page--track) .track-wrap{max-width:none;} :where(.isq-page--track) .track-grid{display:grid;grid-template-columns:minmax(0,960px);justify-content:center;gap:40px;} :where(.isq-page--track) .track-side .label{margin-bottom:22px;} :where(.isq-page--track) .track-side h2{margin:0 0 20px;max-width:12ch;} :where(.isq-page--track) .track-side p{font-size:17px;line-height:1.65;color:#5E5E5E;max-width:40ch;margin:0;} :where(.isq-page--track) .track-notes{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;} :where(.isq-page--track) .track-notes li{padding:16px 0;border-top:1px solid #DADADA;font-size:15px;color:#111;display:flex;align-items:center;gap:12px;} :where(.isq-page--track) .track-notes li:last-child{border-bottom:1px solid #DADADA;} :where(.isq-page--track) .track-notes li::before{content:"";width:6px;height:6px;border-radius:50%;background:#380E0E;flex:none;} :where(.isq-page--track) .track-grid .result{grid-column:1;} @media (pointer:coarse) and (max-width:860px){ :where(.isq-page--track) .track-grid{grid-template-columns:1fr;gap:32px;} :where(.isq-page--track) .track-grid .result{grid-column:1;} } :where(.isq-page--track) .track-head{text-align:center;margin-bottom:44px;} :where(.isq-page--track) .track-head h1{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(34px,4.6vw,58px);letter-spacing:-.02em;color:var(--black);line-height:1;} :where(.isq-page--track) .track-head p{font-size:16px;color:var(--ink-soft);margin-top:16px;} :where(.isq-page--track) .track-card{background:#F1F1F1;border:0;border-radius:16px;padding:48px 44px;} :where(.isq-page--track) .track-card .field{display:flex;flex-direction:column;gap:7px;margin-bottom:18px;} :where(.isq-page--track) .track-card label{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-deep);} :where(.isq-page--track) .track-card input{font-family:var(--sans);font-size:15px;background:var(--bone);border:1px solid var(--greige-300);border-radius:5px;padding:14px 16px;outline:none;transition:border-color .2s;} :where(.isq-page--track) .track-card input:focus{border-color:var(--brass-deep);} :where(.isq-page--track) .track-card .btn{width:100%;justify-content:center;margin-top:6px;} :where(.isq-page--track) .track-hint{text-align:center;font-size:13px;color:var(--ink-soft);margin-top:18px;} :where(.isq-page--track) .track-hint a{color:var(--black);border-bottom:1px solid var(--brass);} /* result timeline */ :where(.isq-page--track) .result{margin-top:30px;display:none;} :where(.isq-page--track) .result.show{display:block;} :where(.isq-page--track) .result .sum{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;border:1px solid var(--hair);border-radius:12px;padding:22px 24px;background:var(--chalk);margin-bottom:30px;} :where(.isq-page--track) .result .sum .k{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:5px;} :where(.isq-page--track) .result .sum .v{font-size:15px;color:var(--black);font-weight:600;} :where(.isq-page--track) .timeline{position:relative;padding-left:34px;} :where(.isq-page--track) .timeline::before{content:"";position:absolute;left:9px;top:6px;bottom:6px;width:2px;background:var(--greige-300);} :where(.isq-page--track) .tstep{position:relative;padding:0 0 30px;} :where(.isq-page--track) .tstep:last-child{padding-bottom:0;} :where(.isq-page--track) .tstep .dot{position:absolute;left:-34px;top:0;width:20px;height:20px;border-radius:50%;background:var(--bone);border:2px solid var(--greige-300);display:flex;align-items:center;justify-content:center;} :where(.isq-page--track) .tstep.done .dot{background:var(--brass);border-color:var(--brass);} :where(.isq-page--track) .tstep.done .dot svg{width:11px;height:11px;stroke:var(--black);fill:none;stroke-width:2.4;} :where(.isq-page--track) .tstep.current .dot{border-color:var(--brass-deep);box-shadow:0 0 0 4px rgba(56,14,14,.2);} :where(.isq-page--track) .tstep h4{font-family:var(--head);font-weight:500;font-size:16px;text-transform:uppercase;letter-spacing:.01em;color:var(--black);margin-bottom:4px;} :where(.isq-page--track) .tstep.pending h4{color:var(--greige-500);} :where(.isq-page--track) .tstep p{font-size:13.5px;color:var(--ink-soft);} :where(.isq-page--track) .tstep .when{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--brass-deep);margin-top:3px;} :where(.isq-page--track) .nx{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;} :where(.isq-page--track) .nx-c{background:#FFFFFF;border-radius:14px;padding:36px 32px 40px;border-top:3px solid #380E0E;} :where(.isq-page--track) .nx-c span{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#5E5E5E;margin-bottom:28px;} :where(.isq-page--track) .nx-c h3{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:18px;line-height:1.2;color:#111;margin:0 0 12px;} :where(.isq-page--track) .nx-c p{font-size:15.5px;line-height:1.65;color:#5E5E5E;margin:0;} :where(.isq-page--track) .nx-links{display:flex;justify-content:center;gap:40px;margin-top:48px;} @media (pointer:coarse) and (max-width:1024px){ :where(.isq-page--track) .nx{grid-template-columns:repeat(2,minmax(0,1fr));} } @media (pointer:coarse) and (max-width:600px){ :where(.isq-page--track) .nx{grid-template-columns:1fr;} :where(.isq-page--track) .nx-links{flex-direction:column;align-items:center;gap:20px;} } /* ---- page: account.html ---- */ :where(.isq-page--account) .acc{display:grid;grid-template-columns:240px minmax(0,1fr);gap:clamp(40px,6vw,88px);align-items:start;} :where(.isq-page--account) .acc-nav{position:sticky;top:110px;display:flex;flex-direction:column;border-top:1px solid #DADADA;} :where(.isq-page--account) .acc-nav button{all:unset;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:18px 0;border-bottom:1px solid #DADADA;font:500 12px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#5E5E5E;} :where(.isq-page--account) .acc-nav button.on{color:#111;} :where(.isq-page--account) .acc-nav button.on::after{content:"";width:7px;height:7px;border-radius:50%;background:#380E0E;} :where(.isq-page--account) .acc-nav button.out{color:#380E0E;} :where(.isq-page--account) .acc-hi .label{margin-bottom:16px;} :where(.isq-page--account) .acc-hi h2{margin:0 0 10px;} :where(.isq-page--account) .acc-hi p{font-size:16px;color:#5E5E5E;margin:0 0 44px;} :where(.isq-page--account) .acc-p{display:none;} :where(.isq-page--account) .acc-p.on{display:block;} :where(.isq-page--account) .acc-h{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:20px;letter-spacing:.01em;color:#111;margin:0 0 22px;} :where(.isq-page--account) .ord{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) auto auto;gap:24px;align-items:center;padding:24px 28px;background:#F1F1F1;border-radius:14px;margin-bottom:14px;} :where(.isq-page--account) .ord .n{font-family:var(--mono);font-size:13px;letter-spacing:.08em;color:#111;} :where(.isq-page--account) .ord .d{font-size:14px;color:#5E5E5E;margin-top:6px;} :where(.isq-page--account) .ord .it{font-size:15px;color:#111;} :where(.isq-page--account) .ord .tt{font-family:var(--head);font-size:17px;color:#111;} :where(.isq-page--account) .ord .st{display:inline-flex;align-items:center;gap:8px;font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#380E0E;margin-top:8px;} :where(.isq-page--account) .ord .st::before{content:"";width:6px;height:6px;border-radius:50%;background:#380E0E;} :where(.isq-page--account) .ord a.tl{font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#111;border-bottom:1px solid #380E0E;padding-bottom:4px;} :where(.isq-page--account) .acc-empty{background:#F1F1F1;border-radius:14px;padding:48px 40px;text-align:center;} :where(.isq-page--account) .acc-empty p{font-size:16px;color:#5E5E5E;margin:0 0 24px;} :where(.isq-page--account) .adr{background:#F1F1F1;border-radius:14px;padding:32px;max-width:520px;} :where(.isq-page--account) .adr .k{font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#5E5E5E;margin-bottom:14px;} :where(.isq-page--account) .adr p{font-size:16px;line-height:1.7;color:#111;margin:0;} :where(.isq-page--account) .adr small{display:block;margin-top:18px;font-size:13.5px;color:#5E5E5E;} :where(.isq-page--account) .pref{display:flex;flex-direction:column;gap:0;max-width:560px;border-top:1px solid #DADADA;} :where(.isq-page--account) .pref .row{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 0;border-bottom:1px solid #DADADA;} :where(.isq-page--account) .pref .row b{display:block;font-weight:500;font-size:16px;color:#111;} :where(.isq-page--account) .pref .row span{display:block;font-size:14px;color:#5E5E5E;margin-top:4px;} :where(.isq-page--account) .tg{position:relative;width:46px;height:26px;flex:none;} :where(.isq-page--account) .tg input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer;z-index:1;} :where(.isq-page--account) .tg i{position:absolute;inset:0;border-radius:999px;background:#CFCFCF;transition:background .2s;} :where(.isq-page--account) .tg i::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .2s;} :where(.isq-page--account) .tg input:checked+i{background:#380E0E;} :where(.isq-page--account) .tg input:checked+i::after{transform:translateX(20px);} :where(.isq-page--account) .acc-out{max-width:560px;margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center;} :where(.isq-page--account) .acc-out .label{margin-bottom:16px;} :where(.isq-page--account) .acc-out h2{margin:0 0 16px;} :where(.isq-page--account) .acc-out p{font-size:17px;color:#5E5E5E;margin:0 0 32px;} :where(.isq-page--account) .acc-out .row{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;} @media (pointer:coarse) and (max-width:860px){ :where(.isq-page--account) .acc{grid-template-columns:1fr;} :where(.isq-page--account) .acc-nav{position:static;flex-direction:row;overflow-x:auto;border-top:0;border-bottom:1px solid #DADADA;gap:24px;} :where(.isq-page--account) .acc-nav button{border-bottom:0;white-space:nowrap;} :where(.isq-page--account) .ord{grid-template-columns:1fr auto;} } /* ---- page: checkout.html ---- */ :where(.isq-page--checkout) .co-wrap{display:grid;grid-template-columns:1.25fr .85fr;gap:0;min-height:100vh;} :where(.isq-page--checkout) .co-main{padding:44px clamp(24px,5vw,72px) 80px;background:var(--bone);} :where(.isq-page--checkout) .co-side{padding:44px clamp(24px,4vw,52px) 60px;background:var(--chalk);border-left:1px solid var(--hair);} :where(.isq-page--checkout) .co-brand{display:flex;align-items:center;justify-content:space-between;margin-bottom:36px;} :where(.isq-page--checkout) .co-brand img{height:17px;} :where(.isq-page--checkout) .co-brand a.back{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);} :where(.isq-page--checkout) .co-brand a.back:hover{color:var(--brass-deep);} /* steps */ :where(.isq-page--checkout) .co-steps{display:flex;align-items:center;gap:10px;margin-bottom:34px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;} :where(.isq-page--checkout) .co-steps .s{display:flex;align-items:center;gap:8px;color:var(--greige-500);} :where(.isq-page--checkout) .co-steps .s .d{width:20px;height:20px;border-radius:50%;border:1px solid var(--greige-300);display:inline-flex;align-items:center;justify-content:center;font-size:9px;} :where(.isq-page--checkout) .co-steps .s.on{color:var(--black);} :where(.isq-page--checkout) .co-steps .s.on .d{background:var(--black);border-color:var(--black);color:var(--brass);} :where(.isq-page--checkout) .co-steps .s.done .d{background:var(--brass);border-color:var(--brass);color:var(--black);} :where(.isq-page--checkout) .co-steps .ln{flex:1;height:1px;background:var(--greige-300);min-width:16px;} :where(.isq-page--checkout) .co-h{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:18px;letter-spacing:.01em;color:var(--black);margin:0 0 4px;} :where(.isq-page--checkout) .co-sub{font-size:13.5px;color:var(--ink-soft);margin-bottom:22px;} :where(.isq-page--checkout) fieldset{border:0;padding:0;margin:0 0 30px;} :where(.isq-page--checkout) .grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px;} :where(.isq-page--checkout) .grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;} :where(.isq-page--checkout) .f{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;} :where(.isq-page--checkout) .f label{font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--brass-deep);} :where(.isq-page--checkout) .f input,:where(.isq-page--checkout) .f select,:where(.isq-page--checkout) .f textarea{font-family:var(--sans);font-size:15px;color:var(--black);background:var(--white);border:1px solid var(--greige-300);border-radius:5px;padding:13px 15px;outline:none;transition:border-color .18s,box-shadow .18s;width:100%;} :where(.isq-page--checkout) .f input:focus,:where(.isq-page--checkout) .f select:focus,:where(.isq-page--checkout) .f textarea:focus{border-color:var(--brass-deep);box-shadow:0 0 0 3px rgba(56,14,14,.14);} :where(.isq-page--checkout) .f select{appearance:none;-webkit-appearance:none;padding-right:38px;background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%208'%3E%3Cpath%20d='M1%201l5%205%205-5'%20fill='none'%20stroke='%23947C44'%20stroke-width='1.5'%20stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:11px;} :where(.isq-page--checkout) .f.bad input,:where(.isq-page--checkout) .f.bad select{border-color:#B4553F;background:#FDF7F5;} :where(.isq-page--checkout) .f .err{font-size:11.5px;color:#B4553F;display:none;} :where(.isq-page--checkout) .f.bad .err{display:block;} /* payment options */ :where(.isq-page--checkout) .pays{display:flex;flex-direction:column;gap:10px;} :where(.isq-page--checkout) .pay{display:flex;align-items:flex-start;gap:13px;border:1px solid var(--greige-300);border-radius:8px;padding:16px 18px;cursor:pointer;background:var(--white);transition:border-color .18s,background .18s;} :where(.isq-page--checkout) .pay:hover{border-color:var(--brass);} :where(.isq-page--checkout) .pay.on{border-color:var(--brass-deep);background:rgba(56,14,14,.07);} :where(.isq-page--checkout) .pay input{margin-top:3px;accent-color:#380E0E;} :where(.isq-page--checkout) .pay .nm{font-size:14.5px;font-weight:600;color:var(--black);} :where(.isq-page--checkout) .pay .ds{font-size:12.5px;color:var(--ink-soft);margin-top:3px;line-height:1.5;} :where(.isq-page--checkout) .pay .logos{display:flex;gap:6px;margin-top:9px;} :where(.isq-page--checkout) .pay .logos span{font-family:var(--mono);font-size:8.5px;letter-spacing:.08em;border:1px solid var(--greige-300);border-radius:3px;padding:3px 7px;color:var(--greige-700);text-transform:uppercase;} /* actions */ :where(.isq-page--checkout) .co-nav{display:flex;gap:14px;align-items:center;margin-top:6px;} :where(.isq-page--checkout) .co-nav .btn{min-width:190px;justify-content:center;} :where(.isq-page--checkout) .co-nav a.prev{font-size:13.5px;color:var(--ink-soft);text-decoration:underline;} :where(.isq-page--checkout) .co-nav a.prev:hover{color:var(--black);} /* summary */ :where(.isq-page--checkout) .sum-h{font-family:var(--mono);font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:20px;} :where(.isq-page--checkout) .sum-item{display:grid;grid-template-columns:58px 1fr auto;gap:14px;padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid var(--hair);align-items:start;} :where(.isq-page--checkout) .sum-item .th{width:58px;height:74px;border-radius:4px;overflow:hidden;background:var(--white);border:1px solid var(--hair);} :where(.isq-page--checkout) .sum-item .th .ph{width:100%;height:100%;} :where(.isq-page--checkout) .sum-item .nm{font-family:var(--head);font-size:13px;text-transform:uppercase;color:var(--black);line-height:1.15;} :where(.isq-page--checkout) .sum-item .mt{font-size:12px;color:var(--ink-soft);margin-top:4px;} :where(.isq-page--checkout) .sum-item .pr{font-family:var(--mono);font-size:13px;color:var(--black);white-space:nowrap;} :where(.isq-page--checkout) .sum-row{display:flex;justify-content:space-between;font-size:14px;color:var(--ink);margin-bottom:11px;} :where(.isq-page--checkout) .sum-row.tot{border-top:1px solid var(--greige-300);margin-top:16px;padding-top:16px;font-size:18px;color:var(--black);} :where(.isq-page--checkout) .sum-row.tot .l{font-family:var(--head);text-transform:uppercase;font-size:16px;} :where(.isq-page--checkout) .sum-row .free{color:var(--brass-deep);font-weight:600;} :where(.isq-page--checkout) .sum-badges{margin-top:26px;padding-top:22px;border-top:1px solid var(--hair);display:flex;flex-direction:column;gap:12px;} :where(.isq-page--checkout) .sum-badges .b{display:flex;gap:10px;align-items:center;font-size:12.5px;color:var(--ink-soft);} :where(.isq-page--checkout) .sum-badges svg{width:15px;height:15px;stroke:var(--brass-deep);fill:none;stroke-width:1.5;flex:none;} /* confirmation */ :where(.isq-page--checkout) .conf{max-width:620px;margin:0 auto;text-align:center;padding:40px 0 20px;} :where(.isq-page--checkout) .conf .tick{width:66px;height:66px;border-radius:50%;background:var(--brass);display:flex;align-items:center;justify-content:center;margin:0 auto 26px;animation:pop .5s cubic-bezier(.2,1.4,.4,1) both;} :where(.isq-page--checkout) .conf .tick svg{width:30px;height:30px;stroke:var(--black);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:40;stroke-dashoffset:40;animation:draw .5s .25s ease forwards;} @keyframes pop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}} @keyframes draw{to{stroke-dashoffset:0}} :where(.isq-page--checkout) .conf h1{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(28px,4vw,42px);letter-spacing:-.02em;color:var(--black);line-height:1.05;margin-bottom:14px;} :where(.isq-page--checkout) .conf .lead{font-size:16px;color:var(--ink-soft);line-height:1.65;max-width:44ch;margin:0 auto 30px;} :where(.isq-page--checkout) .conf .ordbox{background:var(--chalk);border:1px solid var(--hair);border-radius:12px;padding:26px 28px;text-align:left;margin-bottom:22px;} :where(.isq-page--checkout) .conf .ordbox .k{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:6px;} :where(.isq-page--checkout) .conf .ordbox .num{font-family:var(--mono);font-size:22px;color:var(--black);letter-spacing:.04em;margin-bottom:18px;} :where(.isq-page--checkout) .conf .ordbox .lines{display:flex;flex-direction:column;gap:9px;} :where(.isq-page--checkout) .conf .ordbox .ln{display:flex;justify-content:space-between;font-size:13.5px;color:var(--ink);} :where(.isq-page--checkout) .conf .ordbox .ln span:first-child{color:var(--ink-soft);} :where(.isq-page--checkout) .conf .next{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;} :where(.isq-page--checkout) .conf .mailnote{font-size:13px;color:var(--greige-500);margin-top:24px;line-height:1.6;} /* empty */ :where(.isq-page--checkout) .co-empty{text-align:center;padding:80px 20px;} :where(.isq-page--checkout) .co-empty h2{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:26px;color:var(--black);margin-bottom:12px;} :where(.isq-page--checkout) .co-empty p{color:var(--ink-soft);margin-bottom:24px;} /* btn loading */ :where(.isq-page--checkout) .btn.loading{pointer-events:none;opacity:.75;position:relative;color:transparent!important;} :where(.isq-page--checkout) .btn.loading::after{content:"";position:absolute;width:17px;height:17px;border:2px solid rgba(22,21,16,.25);border-top-color:var(--black);border-radius:50%;animation:spin .7s linear infinite;} :where(.isq-page--checkout) .btn-dark.loading::after,:where(.isq-page--checkout) .btn.btn-dark.loading::after{border-color:rgba(255,255,255,.3);border-top-color:#F1F1F1;} @keyframes spin{to{transform:rotate(360deg)}} :where(.isq-page--checkout) .form-error{background:#FDF3F0;border-left:2px solid #B4553F;color:#8E4130;font-size:13.5px;padding:13px 16px;border-radius:0 6px 6px 0;margin-bottom:20px;display:none;line-height:1.55;} :where(.isq-page--checkout) .form-error.on{display:block;} :where(.isq-page--checkout) .testmode{display:none;background:rgba(56,14,14,.12);border:1px solid var(--brass);border-radius:8px;padding:12px 16px;font-size:12.5px;color:#380E0E;line-height:1.55;margin-bottom:20px;} :where(.isq-page--checkout) .testmode.on{display:block;} :where(.isq-page--checkout) .testmode b{color:var(--black);} @media (pointer:coarse) and (max-width:940px){ :where(.isq-page--checkout) .co-wrap{grid-template-columns:1fr;} :where(.isq-page--checkout) .co-side{border-left:0;border-top:1px solid var(--hair);order:-1;padding-bottom:36px;} :where(.isq-page--checkout) .grid2,:where(.isq-page--checkout) .grid3{grid-template-columns:1fr;} } :where(.isq-page--checkout) .gift-tg{display:flex;align-items:center;gap:12px;font-size:15px;color:#111;cursor:pointer;padding:4px 0;} :where(.isq-page--checkout) .gift-tg input{width:18px;height:18px;accent-color:#380E0E;margin:0;} :where(.isq-page--checkout) .gift-tg.sm{font-size:14px;color:#5E5E5E;margin-top:2px;} :where(.isq-page--checkout) .gift-body{display:none;margin-top:16px;} :where(.isq-page--checkout) .gift-body.on{display:block;} :where(.isq-page--checkout) .sum-pay{margin-top:22px;padding-top:18px;border-top:1px solid #DADADA;} :where(.isq-page--checkout) .sum-pay span{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#5E5E5E;margin-bottom:10px;} :where(.isq-page--checkout) .sum-pay div{display:flex;flex-wrap:wrap;gap:6px;} :where(.isq-page--checkout) .sum-pay i{font:normal 500 10.5px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#111;border:1px solid #CFCFCF;border-radius:4px;padding:7px 9px;background:#fff;} :where(.isq-page--checkout) .co-main{background:#FFFFFF!important;} :where(.isq-page--checkout) .co-side{background:#F1F1F1!important;border-left:0!important;} @media (min-width:901px){ :where(.isq-page--checkout) .co-side>*{position:relative;} :where(.isq-page--checkout) .co-side{position:sticky;top:0;align-self:start;min-height:100vh;} } :where(.isq-page--checkout) .co-brand{margin-bottom:44px!important;} :where(.isq-page--checkout) .co-brand img{height:20px!important;} :where(.isq-page--checkout) .co-brand a.back{font-size:11.5px!important;color:#111!important;} :where(.isq-page--checkout) .co-steps{font-size:11px!important;margin-bottom:52px!important;} :where(.isq-page--checkout) .co-steps .s{color:#8C8C8C!important;} :where(.isq-page--checkout) .co-steps .s .d{width:26px!important;height:26px!important;font-size:10.5px!important;border-color:#CFCFCF!important;} :where(.isq-page--checkout) .co-steps .s.on{color:#111!important;} :where(.isq-page--checkout) .co-steps .s.on .d{background:#380E0E!important;border-color:#380E0E!important;color:#FFFFFF!important;} :where(.isq-page--checkout) .co-steps .s.done{color:#111!important;} :where(.isq-page--checkout) .co-steps .s.done .d{background:#FFFFFF!important;border-color:#380E0E!important;color:#380E0E!important;} :where(.isq-page--checkout) .co-steps .ln{background:#DADADA!important;} :where(.isq-page--checkout) #step1 fieldset,:where(.isq-page--checkout) #step2 fieldset{padding-bottom:40px!important;margin-bottom:40px!important;border-bottom:1px solid #EAEAEA!important;} :where(.isq-page--checkout) .co-h{font-weight:300!important;font-size:26px!important;letter-spacing:-.005em!important;margin-bottom:8px!important;} :where(.isq-page--checkout) .co-sub{font-size:15.5px!important;color:#5E5E5E!important;margin-bottom:28px!important;} :where(.isq-page--checkout) .f{margin-bottom:18px!important;gap:9px!important;} :where(.isq-page--checkout) .f label{font-size:11px!important;letter-spacing:.14em!important;color:#111111!important;} :where(.isq-page--checkout) .f input,:where(.isq-page--checkout) .f select,:where(.isq-page--checkout) .f textarea{font-size:16px!important;padding:16px 18px!important;border-color:#CFCFCF!important;border-radius:8px!important;} :where(.isq-page--checkout) .f input::placeholder,:where(.isq-page--checkout) .f textarea::placeholder{color:#9A9A9A;} :where(.isq-page--checkout) .f input:focus,:where(.isq-page--checkout) .f select:focus,:where(.isq-page--checkout) .f textarea:focus{border-color:#380E0E!important;box-shadow:0 0 0 3px rgba(56,14,14,.12)!important;} :where(.isq-page--checkout) .grid2,:where(.isq-page--checkout) .grid3{gap:18px!important;} :where(.isq-page--checkout) .gift-tg{font-size:16px!important;} :where(.isq-page--checkout) .gift-tg.sm{font-size:15px!important;} :where(.isq-page--checkout) .pay{border-radius:10px!important;padding:20px 22px!important;border-color:#DADADA!important;} :where(.isq-page--checkout) .pay.on{border-color:#380E0E!important;box-shadow:0 0 0 1px #380E0E inset;background:#FBF8F8!important;} :where(.isq-page--checkout) .pay .nm{font-size:16px!important;color:#111!important;} :where(.isq-page--checkout) .pay .ds{font-size:14.5px!important;color:#5E5E5E!important;} :where(.isq-page--checkout) .pay input{accent-color:#380E0E;} :where(.isq-page--checkout) .co-nav{flex-direction:column;align-items:stretch!important;gap:18px!important;} :where(.isq-page--checkout) .co-nav .btn{height:62px;font-size:12.5px!important;letter-spacing:.2em!important;width:100%;} :where(.isq-page--checkout) .co-nav a.prev{text-align:center;font-size:14.5px!important;color:#111!important;} :where(.isq-page--checkout) .sum-h{font-family:var(--head)!important;font-weight:400!important;font-size:22px!important;letter-spacing:.005em!important;color:#111!important;margin-bottom:28px!important;} :where(.isq-page--checkout) .sum-item{grid-template-columns:76px 1fr auto!important;gap:18px!important;padding-bottom:26px!important;margin-bottom:26px!important;border-color:#DADADA!important;} :where(.isq-page--checkout) .sum-item .th{width:76px!important;height:96px!important;border-radius:8px!important;} :where(.isq-page--checkout) .sum-item .nm{font-size:15px!important;} :where(.isq-page--checkout) .sum-item .mt{font-size:14px!important;margin-top:7px!important;color:#5E5E5E!important;} :where(.isq-page--checkout) .sum-item .pr{font-family:var(--sans)!important;font-size:16px!important;} :where(.isq-page--checkout) .sum-row{font-size:15.5px!important;color:#111!important;margin-bottom:14px!important;} :where(.isq-page--checkout) .sum-row span:first-child{color:#3A3A3A;} :where(.isq-page--checkout) .sum-row.tot{border-color:#111!important;margin-top:22px!important;padding-top:22px!important;font-size:24px!important;} :where(.isq-page--checkout) .sum-row.tot .l{font-size:18px!important;color:#111!important;} :where(.isq-page--checkout) .sum-row .free{color:#380E0E!important;} :where(.isq-page--checkout) .sum-badges{margin-top:32px!important;padding-top:28px!important;gap:16px!important;border-color:#DADADA!important;} :where(.isq-page--checkout) .sum-badges .b{font-size:14.5px!important;color:#111!important;gap:14px!important;} :where(.isq-page--checkout) .sum-badges .b svg{stroke:#380E0E!important;width:20px;height:20px;} :where(.isq-page--checkout) .sum-pay{margin-top:28px!important;padding-top:24px!important;border-color:#DADADA!important;} :where(.isq-page--checkout) .sum-pay span{font-size:11px!important;color:#111!important;margin-bottom:14px!important;} :where(.isq-page--checkout) .sum-pay i{height:38px!important;min-width:60px!important;border-radius:6px!important;font-size:13px!important;} :where(.isq-page--checkout) .sum-pay i img{height:22px!important;} /* Islamifiq — responsive layer. Loaded LAST on every page so it can recompose both style.css and per-page rules. Breakpoints: 1280 (small desktop) · 1024 (tablet landscape) · 900 (nav switch) 760 (tablet portrait / large phone) · 560 · 400 (small phone) */ /* ============ global ============ */ html{scroll-padding-top:calc(var(--nav-h) + 18px);} body{overflow-x:hidden;} a,button,summary,[role="button"]{-webkit-tap-highlight-color:rgba(56,14,14,.16);touch-action:manipulation;} @supports(height:100svh){ .hero-full,.hero-split{min-height:calc(100svh - var(--nav-h));} .hero-full.page{min-height:calc(100svh - var(--nav-h));} } /* ---- rails ---- */ @media (pointer:coarse) and (max-width:1280px){ .container,.wide{padding:0 34px;} } @media (pointer:coarse) and (max-width:1024px){ .container,.wide{padding:0 30px;} } @media (pointer:coarse) and (max-width:760px){ .container,.wide{padding:0 22px;} } @media (pointer:coarse) and (max-width:400px){ .container,.wide{padding:0 18px;} } /* ---- section rhythm: airy on tablet, tighter on phone ---- */ @media (pointer:coarse) and (min-width:761px) and (max-width:1024px){ section{padding:96px 0;} .sec-head{margin-bottom:46px;} } @media (pointer:coarse) and (max-width:760px){ section{padding:68px 0;} .sec-head{margin-bottom:34px;} .lead{font-size:17px;line-height:1.66;} .label{letter-spacing:.2em;} .btn{padding:15px 24px;} } @media (pointer:coarse) and (max-width:400px){ section{padding:58px 0;} .btn{padding:14px 20px;font-size:10.5px;letter-spacing:.14em;} } /* ============ announce + nav ============ */ @media (pointer:coarse) and (max-width:1080px){ .nav .center{gap:26px;} .nav .center a{font-size:14.5px;} } @media (pointer:coarse) and (max-width:900px){ .nav .center{display:none;} .nav .row{grid-template-columns:auto 1fr auto;} .nav .brand{justify-self:start;} .nav .right{gap:2px;} .burger{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;} .nav.open .center{display:flex;position:absolute;top:100%;left:0;right:0;inset-inline:0;flex-direction:column;gap:0;background:var(--white);border-bottom:1px solid var(--hair);box-shadow:0 20px 44px rgba(22,21,16,.12);padding:4px 30px 14px;max-height:calc(100svh - var(--nav-h) - 24px);overflow-y:auto;} .nav.open .center a{padding:16px 2px;border-bottom:1px solid var(--hair);width:100%;font-size:16px;font-weight:500;} .nav.open .center a:last-child{border-bottom:0;} } @media (pointer:coarse) and (max-width:760px){ :root{--nav-h:64px;} .nav.scrolled{height:58px;} .nav .brand img{height:18px;} .nav.scrolled .brand img{height:17px;} .nav .ic{width:42px;height:42px;} .nav .ic svg{width:20px;height:20px;} .nav .ic.cart{padding:0 10px;} .nav.open .center{padding:4px 22px 14px;} .announce{font-size:10px;letter-spacing:.14em;padding:8px 16px;} } @media (pointer:coarse) and (max-width:600px){ .announce .sep,.announce .opt{display:none;} } @media (pointer:coarse) and (max-width:400px){ .nav .ic{width:38px;height:38px;} .nav .ic svg{width:19px;height:19px;} .burger{width:40px;} } /* ============ heroes ============ */ @media (pointer:coarse) and (max-width:1024px){ .hero-full{min-height:min(calc(100svh - var(--nav-h)),860px);} .hero-full .content{padding:0 0 7vh;} .hero-full .content .sub{font-size:18px;} } @media (pointer:coarse) and (max-width:760px){ .hero-full{min-height:calc(100svh - var(--nav-h) - 36px);} .hero-full .content{padding:0 0 6vh;} .hero-full .content .sub{font-size:16.5px;max-width:34ch;margin:16px 0 24px;} .hero-full .bg .ph::after{left:20px;bottom:16px;max-width:72%;} .hero-full .bg::after{background:linear-gradient(180deg,rgba(22,21,16,.30) 0%,rgba(22,21,16,.34) 55%,rgba(22,21,16,.52) 100%);} /* inner-page heroes: shorter, so content starts sooner */ .hero-full.page{min-height:58svh;} .hero-full.page .content{padding:0 0 5vh;} .hero-split{min-height:0;} .hero-split .panel{padding:56px 22px 60px;} .hero-split .vis{aspect-ratio:1.1;position:relative;} } @media (pointer:coarse) and (max-width:400px){ .hero-full.page{min-height:52svh;} } /* ============ marquee ============ */ @media (pointer:coarse) and (max-width:1024px){ .marquee .item{font-size:16px;gap:24px;padding:0 24px;} } @media (pointer:coarse) and (max-width:760px){ .marquee{padding:15px 0;} .marquee .item{font-size:14px;gap:18px;padding:0 18px;} .marquee .track{animation-duration:26s;} } /* ============ conviction split ============ */ @media (pointer:coarse) and (max-width:860px){ .conv .vis{max-width:100%;margin:0 auto;} } @media (pointer:coarse) and (max-width:760px){ .conv{gap:30px;} .conv .vis{aspect-ratio:1.05;max-height:none;} .conv .lead{max-width:none;} } /* ============ homepage product trio ============ */ @media (pointer:coarse) and (min-width:761px) and (max-width:1024px){ .trio{gap:20px;} .tcov.mid{margin-top:40px;} } @media (pointer:coarse) and (max-width:760px){ .trio{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:0 -22px;padding:2px 22px 6px;} .trio::-webkit-scrollbar{display:none;} .tcov{flex:0 0 66%;scroll-snap-align:center;margin-top:0!important;} .tcov .ph{aspect-ratio:.8;} .trio-head{flex-direction:column;align-items:flex-start;gap:18px;} .trio-head .btn{margin-bottom:0;} .trio-foot p{max-width:none;} } @media (pointer:coarse) and (max-width:400px){ .trio{margin:0 -18px;padding:2px 18px 6px;} .tcov{flex:0 0 74%;} } /* ============ numbered steps ============ */ @media (pointer:coarse) and (max-width:1024px){ .step{grid-template-columns:104px 1fr;gap:18px 36px;padding:40px 0;} .step p{grid-column:2;padding-top:14px;max-width:62ch;} .step .no{font-size:50px;padding-top:6px;} .step h3{font-size:26px;} .step .vis{display:none;} } @media (pointer:coarse) and (max-width:600px){ .step{grid-template-columns:1fr;gap:0;padding:30px 0;} .step p{grid-column:1;padding-top:12px;} .step .no{font-size:32px;padding-top:0;margin-bottom:12px;} .step .no small{font-size:18px;} .step h3{font-size:23px;} .step .term{margin-bottom:10px;} } #howworks .sec-head-cta .btn{white-space:nowrap;} /* ============ value cards / manifesto ============ */ @media (pointer:coarse) and (max-width:760px){ .vgrid{grid-template-columns:1fr 1fr;gap:26px 18px;} .vcard .ico{width:60px;height:60px;margin-bottom:14px;} .vcard .ico svg{width:26px;height:26px;} .vcard h4{font-size:14.5px;} .vcard p{font-size:13px;} .manifesto h2{max-width:none;} .sec-chalk .manifesto-grid,.sec-dark .manifesto-grid{gap:16px;margin-top:34px;} .sec-chalk .manifesto .mf{padding:28px 24px;} .sec-dark .manifesto .mf{padding:30px 26px 32px;} .sec-dark .manifesto{padding:0;} } @media (pointer:coarse) and (max-width:400px){ .vgrid{grid-template-columns:1fr;gap:22px;} .vcard{text-align:left;display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:start;} .vcard .ico{width:52px;height:52px;margin:0;} .vcard h4{margin-bottom:6px;} } /* ============ reviews carousel ============ */ @media (pointer:coarse) and (max-width:760px){ .reviews .rtrack{gap:16px;animation-duration:56s;} .reviews .tcard{width:290px;padding:26px 22px;} .tcard .av{width:66px;height:66px;margin-bottom:14px;} .tcard p{font-size:13.5px;} } /* ============ FAQ ============ */ .faq .q.open .a{max-height:420px;} @media (pointer:coarse) and (max-width:900px){ .faq .q.open .a{max-height:640px;} } @media (pointer:coarse) and (max-width:760px){ .faq .q button{font-size:17px;padding:20px 0;min-height:56px;gap:14px;} .faq .q .a p{font-size:14.5px;} } /* ============ CTA band ============ */ @media (pointer:coarse) and (max-width:760px){ .cta-band .lead{max-width:none;} .cta-band .display{margin-bottom:18px;} } /* ============ newsletter ============ */ @media (pointer:coarse) and (max-width:760px){ .news .row{gap:26px;} .news .form{flex-direction:column;border-radius:10px;padding:6px;} .news .form input{padding:14px 12px;font-size:16px;} .news .form button{margin:0;padding:15px;border-radius:6px;width:100%;} } /* ============ footer ============ */ @media (pointer:coarse) and (max-width:900px){ .foot{padding:76px 0 40px;} .foot-top{grid-template-columns:1fr;gap:46px;} .foot-cols{grid-template-columns:repeat(3,1fr);gap:30px;} } @media (pointer:coarse) and (max-width:620px){ .foot-cols{grid-template-columns:1fr 1fr;gap:30px 22px;} .foot-brand p{max-width:none;} } @media (pointer:coarse) and (max-width:400px){ .foot{padding:56px 0 32px;} .foot-cols h5{margin-bottom:14px;} .foot-cols ul{gap:11px;} .foot-base{font-size:10px;letter-spacing:.08em;} } /* ============ overlays: search · cart · account ============ */ @media (pointer:coarse) and (max-width:760px){ .search-ov .top{padding:16px 20px;} .search-ov .body{margin-top:2vh;padding:0 22px;} .search-ov .field{padding-bottom:12px;} .search-ov .field svg{width:22px;height:22px;} .search-ov .field input{font-size:22px;} .search-ov .sug{margin-top:24px;} .search-ov .sug a{font-size:13.5px;padding:9px 15px;} .cart-drawer{width:100%;max-width:100%;} .cart-head{padding:18px 22px;} .cart-items{padding:4px 22px;} .cart-foot{padding:18px 22px;} .acct-card{padding:32px 24px;border-radius:12px;} .acct-card h3{font-size:23px;} .lb .stage{width:92vw;height:70vh;} .lb .arw{width:42px;height:42px;} .lb .arw.p{left:10px;} .lb .arw.n{right:10px;} .lb .zhint{display:none;} } /* ============ forms: 16px to stop iOS zoom ============ */ @media (pointer:coarse) and (max-width:760px){ .field input,.field select,.field textarea,.acct-card input,.track-card input,.f input,.f select,.f textarea,.more-form input,.news .form input,.search-ov .field input{font-size:16px;} .field textarea{min-height:120px;} } /* ============ PDP (journal) ============ */ @media (pointer:coarse) and (max-width:1024px){ .pdp{gap:44px;} .vs-col{padding:38px 32px 42px;} #compare{padding:clamp(80px,10vw,120px) 0;} #compare .sec-head{margin-bottom:48px;} } @media (pointer:coarse) and (max-width:980px){ .pdp{padding-top:32px;} } @media (pointer:coarse) and (max-width:760px){ .pdp{gap:30px;padding-top:26px;} .gallery .main{aspect-ratio:.92;margin-bottom:10px;} .gallery .thumbs{gap:8px;} .buy h1{font-size:clamp(30px,9vw,40px);} .buy .price{font-size:28px;margin-bottom:18px;} .buy .desc{font-size:15.5px;margin-bottom:22px;} .buy .swatches{flex-wrap:wrap;gap:9px;} .buy .sw{padding:10px 14px;} .buy .actions{gap:10px;} .buy .qty button{width:44px;height:48px;} .buy .btn.big{min-width:0;} .buy .ship{font-size:10px;letter-spacing:.04em;line-height:1.7;} .trust{gap:10px;padding-top:20px;} .trust .t span{font-size:11px;} .specrow{display:grid;grid-template-columns:1fr 1fr;margin-top:20px;} .specrow .s{flex:none;min-width:0;padding:14px 0;border-right:0;border-bottom:1px solid var(--hair);} .specrow .s:nth-child(odd){padding-right:16px;border-right:1px solid var(--hair);} .specrow .s:nth-child(even){padding-left:16px;} .specrow .s:last-child{grid-column:1/-1;border-bottom:0;border-right:0;padding-right:0;} .etabox{padding:14px 16px;} .etabox .cnt{font-size:13px;} .vs-col{padding:30px 24px 34px;} .vs-col .vs-h{font-size:18px;margin-bottom:24px;} .vs-col ul{gap:16px;} .vs-col li{font-size:14.5px;gap:13px;} #compare .sec-head{margin-bottom:34px;} } /* daily-spread annotation + contents */ @media (pointer:coarse) and (max-width:960px){ .anno{gap:28px;} .anno-shot{aspect-ratio:1.15;} .contents{margin-top:48px;} .contents p{min-height:0;} } @media (pointer:coarse) and (max-width:760px){ .anno-list li{padding:13px 0;gap:13px;} .anno-list b{font-size:13px;} .anno-list p{font-size:13.5px;} .contents>div{padding:22px 0 0;} .contents>div:nth-child(odd){padding-right:18px;} .contents>div:nth-child(even){padding-left:18px;} } @media (pointer:coarse) and (max-width:560px){ .contents>div,.contents>div:nth-child(odd),.contents>div:nth-child(even){padding:20px 0 0;border-right:0;} .contents>div+div{border-top:1px solid var(--greige-300);} } /* page-by-page rail */ @media (pointer:coarse) and (max-width:1000px){ .inside .rail{margin:0 -30px;padding:0 30px 8px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;} .inside .rail::-webkit-scrollbar{display:none;} .inside .rail button{scroll-snap-align:start;border:1px solid var(--greige-300);} .inside .rail button.on{border-color:var(--black);} } @media (pointer:coarse) and (max-width:760px){ .inside{gap:26px;} .inside .rail{margin:0 -22px;padding:0 22px 8px;} .inside .rail .t{font-size:13.5px;} .inside .pane.on{gap:22px;} .inside .pane h3{font-size:20px;} .inside .pane p{font-size:15px;margin-bottom:18px;} .inside .pane .shot{aspect-ratio:1.2;} } /* how it's made */ @media (pointer:coarse) and (max-width:1024px){ .craft{grid-template-columns:1fr 1fr;gap:20px;} .craftcard:last-child{grid-column:1/-1;} .craftcard{padding:30px 26px;} } @media (pointer:coarse) and (max-width:760px){ .craft{grid-template-columns:1fr;gap:14px;} .craftcard:last-child{grid-column:auto;} .craftcard{padding:26px 22px;} .craftcard .n{font-size:28px;margin-bottom:14px;} .matlist{margin-top:40px;padding-top:26px;row-gap:22px;} .matlist dd{font-size:17px;} #howmade .sec-head{margin-bottom:44px;} } @media (pointer:coarse) and (max-width:400px){ .matlist{grid-template-columns:1fr;} .matlist>div,.matlist>div:nth-child(odd),.matlist>div:nth-child(even){padding:0;border-right:0;} } /* size reference */ @media (pointer:coarse) and (max-width:760px){ .sizeref{gap:28px;} .sizeref .viz{min-height:0;padding:36px 24px 30px;} .sizeref .obj.a4>.box{width:150px;height:212px;} .sizeref .obj.j .box{width:106px;height:150px;} .sizeref dl{gap:16px 20px;} } /* comparison table (if present) */ @media (pointer:coarse) and (max-width:700px){ .compare .crow{grid-template-columns:1.2fr .9fr .9fr;} .compare .crow>div,.compare .head>div{padding:13px 12px;font-size:12.5px;} } /* ============ shop ============ */ @media (pointer:coarse) and (min-width:621px) and (max-width:1024px){ .grid3-shop{gap:20px;} } @media (pointer:coarse) and (max-width:620px){ .grid3-shop{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:0 -22px 56px;padding:2px 22px 6px;} .grid3-shop::-webkit-scrollbar{display:none;} .grid3-shop>.prod{flex:0 0 68%;scroll-snap-align:center;} .prod .img{margin-bottom:14px;} } @media (pointer:coarse) and (max-width:860px){ .feat-shop .vis{min-height:0;aspect-ratio:1.15;} .feat-shop .vis .ph{position:absolute;inset:0;} } @media (pointer:coarse) and (max-width:760px){ .feat-shop{margin-bottom:48px;border-radius:12px;} .feat-shop .panel{padding:32px 24px 36px;} .feat-shop p{max-width:none;} .feat-shop .row{gap:10px;} .feat-shop .row .btn{flex:1 1 auto;justify-content:center;} .more-panel{border-radius:12px;} .more-panel .mc-text,.more-panel .mc-form{padding:30px 24px;} .more-panel .mc-form{padding-top:0;} .shop-head{margin-bottom:38px;} .coll{grid-template-columns:1fr 1fr;gap:18px;} } /* ============ about ============ */ @media (pointer:coarse) and (max-width:1024px){ .legacy{gap:44px;} .road{gap:18px;} .road .item{padding:26px;} } @media (pointer:coarse) and (max-width:760px){ .who{gap:28px;} .who-h{max-width:none;} .who-r .lead{margin-bottom:26px;} .story{border-bottom:0;} .beat{padding:28px 0 30px;} .beat-n{font-size:34px;margin-bottom:18px;} .beat h3{font-size:16px;} .beat p{font-size:15px;} .pull-wide{margin-top:40px;padding:0;} .pull{padding-left:18px;margin:22px 0;} .legacy{gap:28px;} .legacy .txt-col{max-width:none;} .legacy .vis{aspect-ratio:1.1;} .belief .cap-img{width:170px;height:86px;margin-bottom:28px;} .road .item{padding:24px 22px;} .road .no{font-size:32px;} .road h4{font-size:17px;} .road .now{margin-top:20px;padding-top:14px;} } @media (pointer:coarse) and (max-width:560px){ .who-facts{grid-template-columns:1fr;gap:18px;} } /* ============ contact ============ */ @media (pointer:coarse) and (max-width:760px){ .contact-hero p{font-size:16.5px;} .cwrap{gap:30px;} .cform{padding:24px 20px;border-radius:12px;} .cinfo .v{font-size:19px;} .cinfo .blk{padding:22px 0;} } /* ============ track order ============ */ @media (pointer:coarse) and (max-width:760px){ .track-card{padding:26px 22px;border-radius:12px;} .track-head{margin-bottom:34px;} .track-head p{font-size:15px;} .result .sum{padding:18px 18px;gap:16px 22px;} .timeline{padding-left:30px;} .tstep .dot{left:-30px;} } /* ============ checkout ============ */ @media (pointer:coarse) and (max-width:940px){ .co-wrap{min-height:0;} .grid3{grid-template-columns:1fr 1fr;} .grid2{grid-template-columns:1fr 1fr;} } @media (pointer:coarse) and (max-width:760px){ .co-main{padding:32px 22px 64px;} .co-side{padding:30px 22px 34px;} .co-brand{margin-bottom:26px;} .co-steps{gap:7px;font-size:9px;letter-spacing:.08em;margin-bottom:26px;} .co-steps .s .d{width:18px;height:18px;font-size:8.5px;} .co-steps .ln{min-width:10px;} .grid2,.grid3{grid-template-columns:1fr;gap:0;} .co-nav{flex-direction:column;align-items:stretch;gap:12px;} .co-nav .btn{width:100%;min-width:0;} .co-nav a.prev{text-align:center;} .conf{padding:26px 0 10px;} .conf .tick{width:56px;height:56px;margin-bottom:20px;} .sum-item{grid-template-columns:52px 1fr auto;} .sum-item .th{width:52px;height:66px;} } /* ============ legal pages ============ */ @media (pointer:coarse) and (max-width:1024px){ .legal{max-width:820px;} } @media (pointer:coarse) and (max-width:760px){ .legal-hero{padding:48px 0 40px;} .legal .toc{padding:22px 20px;margin-bottom:32px;} .legal .toc ol{gap:12px 18px;} .legal section{padding:32px 0;} .legal h2{font-size:19px;margin-bottom:13px;gap:10px;} .legal p{font-size:16px;line-height:1.72;} .legal>p{margin-bottom:30px;} .legal li{font-size:16px;line-height:1.72;} .legal .note{padding:16px 18px;margin-top:26px;} } /* ============ 404 ============ */ @media (pointer:coarse) and (max-width:760px){ .nf{padding:56px 22px;min-height:calc(100svh - var(--nav-h));} .nf .big{font-size:clamp(84px,26vw,150px);} } /* ============ touch devices ============ */ @media(hover:none){ .tcov:hover .ph{transform:none;} .prod:hover .img{background:var(--chalk);} .reviews:hover .rtrack{animation-play-state:running;} .nav .ic:hover{background:none;} .nav .ic:hover svg{stroke:currentColor;} .btn-dark:hover,.btn-brass:hover{filter:none;} .btn-line:hover{background:transparent;color:var(--ink);} .btn-line-light:hover{background:transparent;color:var(--bone);} .gallery .main .zoombtn{opacity:.9;} .btn:active{transform:scale(.985);} .tcov:active .ph,.prod:active .img{opacity:.9;} .faq .q button:active{opacity:.7;} } /* ============ audit fixes: 390px / 768px pass ============ */ /* value cards: text must stay in column 2 beside the icon */ @media (pointer:coarse) and (max-width:400px){ .vcard .ico{grid-column:1;grid-row:1/span 2;} .vcard h4,.vcard p{grid-column:2;} .vcard p{font-size:13.5px;line-height:1.6;} } /* horizontal rails must match the 18px container rail at ≤400 (was causing page h-scroll) */ @media (pointer:coarse) and (max-width:400px){ .grid3-shop{margin:0 -18px 48px;padding:2px 18px 6px;} .grid3-shop>.prod{flex:0 0 76%;} .inside .rail{margin:0 -18px;padding:0 18px 8px;} } /* tap targets: 40px+ everywhere */ .nav .brand{min-height:44px;align-items:center;} .cart-close,.search-ov .top button,.acct-card .x,.lb .x{min-width:42px;min-height:42px;display:inline-flex;align-items:center;justify-content:center;} .cart-close{margin-right:-10px;} .acct-card .x{top:8px;right:10px;} @media (pointer:coarse) and (max-width:760px){ .foot-cols ul{gap:0;} .foot-cols li a{display:block;padding:11px 0;} .foot-legal{gap:20px;} .foot-legal a{display:inline-flex;align-items:center;min-height:40px;} .search-ov .field{padding-bottom:10px;} .search-ov .field input{padding:9px 0;} #acctAlt a{display:inline-flex;align-items:center;min-height:34px;} .co-brand a{display:inline-flex;align-items:center;min-height:42px;} } @media (pointer:coarse) and (max-width:400px){ .nav .ic{width:42px;height:42px;} } /* trust row: a legible list on phones instead of three cramped columns */ @media (pointer:coarse) and (max-width:480px){ .trust{grid-template-columns:1fr;gap:0;padding-top:10px;} .trust .t{display:flex;align-items:center;gap:13px;text-align:left;padding:13px 0;border-bottom:1px solid var(--hair);} .trust .t:last-child{border-bottom:0;padding-bottom:0;} .trust .t svg{margin-bottom:0;flex:none;width:21px;height:21px;} .trust .t span{font-size:13.5px;} } /* keep the dark comparison band on the same vertical rhythm as its neighbours */ @media (pointer:coarse) and (min-width:761px) and (max-width:1024px){ #compare{padding:96px 0;} } @media (pointer:coarse) and (max-width:760px){ #compare{padding:68px 0;} } @media (pointer:coarse) and (max-width:400px){ #compare{padding:58px 0;} } /* 404 headline shouldn't drop to 24px */ @media (pointer:coarse) and (max-width:760px){ .nf h1{font-size:27px;} } /* mobile drawer must span the nav, not the centre grid column (.container is position:relative, so it was trapping the absolute panel) */ @media (pointer:coarse) and (max-width:900px){ .nav .row{position:static;} /* justify-self:center (desktop grid) makes an absolute box shrink-to-fit — reset it */ .nav.open .center{justify-self:stretch;align-self:start;width:auto;left:0;right:0;} } /* ============================================================ DESKTOP LOCK — mouse/trackpad contexts always get the full desktop composition at its designed size. vw-based fluid type would otherwise shrink the whole design inside a narrow window (preview panes, half-screen browsers). Touch devices keep the responsive system above, which is gated on (pointer:coarse). ============================================================ */ @media (pointer:fine){ body{min-width:1180px;} /* type scale at designed desktop size */ .h-xl{font-size:104px;} .h-lg{font-size:68px;} .h-md{font-size:44px;} section{padding:128px 0;} .feature h3{font-size:38px;} .cta-band .display{font-size:52px;} .news h3{font-size:40px;} .search-ov .field input{font-size:38px;} .conv{gap:72px;} .hero-split .panel{padding:70px 84px;} /* shop */ .shop-head h1{font-size:66px;} .grid3-shop{margin-bottom:120px;} .feat-shop h2{font-size:44px;} .more-panel .mc-text,.more-panel .mc-form{padding:64px;} .more-panel h3{font-size:40px;} /* journal */ .buy h1{font-size:52px;} #compare{padding:168px 0;} /* about */ .who{gap:96px;} .who-h{font-size:50px;} .pull-wide{font-size:44px;} .pull{font-size:34px;} .belief-q{font-size:48px;} /* contact · track · legal · 404 · checkout */ .contact-hero{padding:120px 0 0;} .contact-hero h1{font-size:88px;} .track-head h1{font-size:58px;} .legal-hero h1{font-size:64px;} .nf .big{font-size:260px;} .nf h1{font-size:38px;} .co-main{padding:44px 72px 80px;} .co-side{padding:44px 52px 60px;} .conf h1{font-size:42px;} } @media(max-width:420px){ .sec-head h2.isq-section-title--single-line{white-space:normal!important;} } /* ===== palette v2: oxblood accent #380E0E · white · grey #F1F1F1 · black ===== */ :root{--brass:#380E0E;--brass-bright:#380E0E;--brass-deep:#380E0E;--brass-text:#380E0E;--bone:#F1F1F1;--chalk:#F1F1F1;--hair:#DADADA;--ink-soft:#5E5E5E;--greige-100:#EBEBEB;--greige-300:#C4C4C4;--greige-500:#8C8C8C;--greige-700:#5E5E5E;} .sec-dark,.foot,.hero-full,.lb,.foot-svc.dk{--brass:#FFFFFF;--brass-bright:#FFFFFF;--brass-deep:#FFFFFF;--brass-text:#FFFFFF;} .foot{border-top:1px solid rgba(255,255,255,.14);} .btn-brass{background:#380E0E;color:#FFFFFF;border:1px solid #380E0E;} .btn-brass:hover{background:#000;border-color:#000;color:#fff;} .sec-dark .btn-brass,.hero-full .btn-brass,.foot .btn-brass{background:#FFFFFF;color:#111111;border-color:#FFFFFF;} .sec-dark .btn-brass:hover,.hero-full .btn-brass:hover,.foot .btn-brass:hover{background:#F1F1F1;} .btn-dark{color:#FFFFFF;} .btn-line:hover{color:#FFFFFF;} .nav .ic .ct{color:#FFFFFF;} .tcard .av{background:linear-gradient(145deg,#6B2323 0%,#380E0E 60%,#220808 100%);} .tcard .av span{color:#FFFFFF;} .tcard .stars{color:#380E0E;} .faq .q .plus{color:#380E0E;} ::selection{background:#380E0E;color:#fff;} a{color:#380E0E;} a:hover{color:#000;} .announce,.announce b,.announce .sep,.announce a{color:#FFFFFF!important;} /* ===== palette v2 — pass 2: contrast fixes + premium refinements ===== */ /* nav: taller, calmer */ :root{--nav-h:84px;} .nav.scrolled{height:72px;} .nav .center{gap:44px;} .nav .center a{font-size:15.5px;letter-spacing:.01em;} /* eyebrows: text stays ink, only the dot carries the accent */ .label{color:#111111;} .label.eyebrow::before,.eyebrow::before,.sec-head .label::before,.cta-band .label::before{background:#380E0E;} .sec-dark .label,.foot .label,.hero-full .label,.legal-hero .label{color:#FFFFFF;} .sec-dark .label::before,.foot .label::before,.hero-full .label::before,.legal-hero .label::before{background:#FFFFFF;} /* hero: white text, dot white */ .hero-full .display,.hero-full .lead{color:#FFFFFF;} .hero-full .btn-line-light{border-color:rgba(255,255,255,.6);color:#FFFFFF;} .hero-full .btn-line-light:hover{background:#FFFFFF;color:#111111;} /* notify button on shop: white text */ .more-sec .more-form button,.more-form button{background:#380E0E;color:#FFFFFF;} .more-sec .more-form button:hover,.more-form button:hover{background:#000;filter:none;} /* struck price + helper greys: darker so they pass */ .price small,.etabox .cnt small,.sizeref .obj .lb2,.tcard .role,.bcard .date,.search-ov .sug .k,.inside .pane .pg{color:#5E5E5E;} /* dimension labels on the black book: white */ .sizeref .dim{color:#FFFFFF;} /* stars: oxblood reads heavy at 13px; thin them */ .tcard .stars{color:#380E0E;font-size:11px;letter-spacing:4px;} /* hairline refinement: oxblood only as a 1px rule under section eyebrows in dark bands */ .sec-dark .sec-head .label{border-bottom:0;} /* big numbers: oxblood at low weight stays premium */ .step .no,.xn{color:#380E0E;} /* comparison badge, selected states, focus */ #compare .vs-col .badge{background:#380E0E;color:#FFFFFF;} input:focus,textarea:focus,select:focus{border-color:#380E0E!important;} .inside .rail button.on .n{color:#FFFFFF;} /* announcement bar: oxblood, white text, slightly taller */ .announce{background:#380E0E;color:#FFFFFF;} /* footer: white top rule instead of accent, accent kept for hover only */ .foot-cols li a:hover,.foot-legal a:hover{color:#FFFFFF;} .feat-shop .price small,.buy .price small{color:#5E5E5E;} .feat-shop .price{color:#111111;} /* conviction v2: statement band */ .conv2 .container{display:grid;grid-template-columns:minmax(0,1fr);justify-items:start;} .conv2 .label{margin-bottom:28px;} .conv2 h2{line-height:1.02;letter-spacing:-.02em;margin:0 0 56px;max-width:14ch;} .conv2 h2 br+*{display:inline;} .conv2-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:48px;align-items:start;width:100%;padding-top:40px;border-top:1px solid #DADADA;} .conv2-row .rule{height:1px;width:64px;background:#380E0E;margin-top:14px;} .conv2-row .lead{max-width:48ch;font-size:19px;line-height:1.6;color:#111111;margin:0;} @media (pointer:coarse) and (max-width:760px){ .conv2-row{grid-template-columns:1fr;gap:20px;padding-top:28px;} .conv2 h2{max-width:none;margin-bottom:36px;} } /* four beliefs: oxblood disc, white icon */ .bf .ico{background:#380E0E;} .bf .ico svg{stroke:#FFFFFF;} /* hero: eyebrow text + dot in oxblood */ .hero-full .label,.hero-full .label.eyebrow{color:#380E0E;} .hero-full .label::before,.hero-full .label.eyebrow::before{background:#380E0E!important;} /* dots everywhere: force oxblood on light, white on dark */ .label::before,.label.eyebrow::before,.eyebrow::before,.sec-head .label::before,.cta-band .label::before,.manifesto .label::before,.trio-head .label::before{background:#380E0E!important;} .sec-dark .label::before,.foot .label::before,.legal-hero .label::before,.sec-dark .manifesto .label::before{background:#380E0E!important;box-shadow:0 0 0 1px rgba(255,255,255,.35);} /* four beliefs: four equal cards */ .b4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;} .b4c{background:#FFFFFF;border:1px solid #DADADA;border-radius:16px;padding:44px 36px 48px;min-height:360px;display:flex;flex-direction:column;} .b4c .ico{width:60px;height:60px;border-radius:50%;background:#380E0E;display:flex;align-items:center;justify-content:center;margin-bottom:auto;} .b4c .ico svg{width:24px;height:24px;stroke:#FFFFFF;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;} .b4c h3{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:18px;line-height:1.2;letter-spacing:.005em;color:#111111;margin:48px 0 14px;} .b4c p{font-size:15.5px;line-height:1.65;color:#5E5E5E;margin:0;text-wrap:pretty;} @media (pointer:coarse) and (max-width:1024px){ .b4{grid-template-columns:repeat(2,minmax(0,1fr));} } @media (pointer:coarse) and (max-width:600px){ .b4{grid-template-columns:1fr;gap:16px;} .b4c{min-height:0;padding:32px 28px 36px;} .b4c h3{margin-top:32px;} } /* conviction v3: editorial split */ .conv3-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(48px,6vw,96px);align-items:start;} .conv3 .label{margin-bottom:28px;} .conv3 h2{line-height:1.02;letter-spacing:-.02em;margin:0;max-width:12ch;text-wrap:balance;} .conv3 .r{padding-top:6px;border-left:1px solid #DADADA;padding-left:clamp(32px,4vw,56px);} .conv3 .r .lead{font-size:18px;line-height:1.65;color:#111111;margin:0 0 22px;max-width:46ch;} .conv3 .r .lead:nth-of-type(2){color:#5E5E5E;} .conv3 .r .tlink{margin-top:10px;border-bottom-color:#380E0E;color:#111111;} .conv3 .r .tlink:hover{color:#380E0E;} @media (pointer:coarse) and (max-width:860px){ .conv3-grid{grid-template-columns:1fr;gap:36px;} .conv3 h2{max-width:none;} .conv3 .r{border-left:0;padding-left:0;border-top:1px solid #DADADA;padding-top:32px;} } /* philosophy (dark band) eyebrow dot: white on black */ .sec-dark .manifesto .label::before,.manifesto .label::before{display:block!important;} .sec-dark .manifesto .label::before{background:#380E0E!important;box-shadow:0 0 0 1px rgba(255,255,255,.35);} /* faq answers: larger */ .faq .q .a p{font-size:16.5px;line-height:1.7;color:#111111;} .faq .q.open .a{max-height:320px;padding-bottom:28px;} .hero-full .label,.hero-full .label.eyebrow{color:#380E0E!important;} .conv3 h2{max-width:none;} .conv3 h2 .nw{white-space:nowrap;} .conv3-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);} /* footer social: all three icons the same */ .foot-social a{color:#F1F1F1;} .foot-social svg{stroke:#F1F1F1;} .foot-social a svg.isq-social-icon--filled{fill:#F1F1F1!important;} .foot-social a:hover{border-color:#FFFFFF;background:rgba(255,255,255,.08);} /* about: what drives us (dark band) dot burgundy w/ ring */ .sec-dark .sec-head .label::before{background:#380E0E!important;box-shadow:0 0 0 1px rgba(255,255,255,.35);} /* search overlay: brand palette */ .search-ov{background:rgba(255,255,255,.98);} .search-ov .field{border-bottom:2px solid #380E0E;} .search-ov .field svg{stroke:#380E0E;} .search-ov .field input{color:#111111;} .search-ov .field input::placeholder{color:#8C8C8C;} .search-ov .sug .k{color:#380E0E;} .search-ov .sug a{border-color:#DADADA;color:#111111;background:#F1F1F1;} .search-ov .sug a:hover{border-color:#380E0E;background:#380E0E;color:#FFFFFF;} .search-ov .top button{color:#111111;} /* comparison: islamifiq ticks burgundy */ #compare .vs-col.us .mk{background:#380E0E;color:#FFFFFF;} /* four beliefs: 2×2 rectangles so it reads differently from the other card rows */ .b4{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;} .b4c{min-height:280px;flex-direction:row;align-items:flex-start;gap:36px;padding:48px 52px;border-radius:12px;} .b4c .ico{margin:0;flex:none;} .b4c .txt{display:flex;flex-direction:column;justify-content:flex-end;min-height:100%;} .b4c h3{margin:0 0 14px;font-size:clamp(22px,2vw,28px);font-weight:300;letter-spacing:-.01em;} .b4c p{font-size:16px;} @media (pointer:coarse) and (max-width:600px){ .b4{grid-template-columns:1fr;} .b4c{flex-direction:column;gap:28px;padding:32px 28px 36px;min-height:0;} } /* four beliefs: icon sits beside the title */ .b4c{flex-direction:column;gap:0;justify-content:flex-end;padding:44px 48px 48px;min-height:250px;} .b4c .hd{display:flex;align-items:center;gap:18px;margin-bottom:18px;} .b4c .hd .ico{width:52px;height:52px;margin:0;} .b4c .hd .ico svg{width:22px;height:22px;} .b4c h3{margin:0;} .b4c p{max-width:44ch;} /* how it's made: burgundy hairline frame, burgundy caption rule */ #howmade .craftcard{background:#FFFFFF;border:1px solid #DADADA;border-top:3px solid #380E0E;border-radius:12px;} #howmade .craftcard .cbody{padding:34px 34px 40px;} #howmade .craftcard h4{display:flex;align-items:center;gap:12px;} #howmade .craftcard h4::before{content:"";width:18px;height:1px;background:#380E0E;flex:none;} /* size: the book is burgundy; dimensions white on it */ .sizeref .obj.j .box{background:#380E0E!important;box-shadow:0 14px 28px -12px rgba(56,14,14,.55)!important;} .sizeref .obj.j .box::before{background:rgba(255,255,255,.28)!important;} .sizeref .dim{color:#FFFFFF!important;font-weight:500;} .sizeref .dim.w{bottom:10px!important;} .sizeref .dim.h{right:14px!important;} .b4c p{max-width:none;white-space:nowrap;} @media (pointer:coarse) and (max-width:600px){ .b4c p{white-space:normal;} } /* four beliefs: icon, title and line all start on one left edge, content centred in the card */ .b4c{justify-content:center;min-height:220px;padding:44px 48px;} .b4c .hd{margin-bottom:16px;} .b4c p{padding-left:70px;} @media (pointer:coarse) and (max-width:600px){ .b4c p{padding-left:0;} } /* how it's made titles: one line */ #howmade .craftcard h4{white-space:nowrap;} /* shop: full-bleed image band */ .img-band{padding:0;height:clamp(320px,42vw,620px);} .img-band .ph{width:100%;height:100%;border-radius:0;} /* conviction v4: arch window */ .conv4-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(56px,7vw,104px);align-items:center;} .conv4-arch{border-radius:999px 999px 0 0;overflow:hidden;aspect-ratio:3/4;} .conv4-arch .ph{width:100%;height:100%;} .conv4-txt .label{margin-bottom:26px;} .conv4-txt h2{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(40px,4.6vw,60px);line-height:1.02;letter-spacing:-.02em;color:#111;margin:0 0 40px;} .conv4-txt p{font-size:18px;line-height:1.65;color:#111;margin:0 0 20px;max-width:44ch;} .conv4-txt .btn{margin-top:16px;} @media (pointer:coarse) and (max-width:860px){ .conv4-grid{grid-template-columns:1fr;gap:40px;} .conv4-arch{max-width:420px;width:100%;margin:0 auto;} } .conv4-arch .ph{outline:0;border-radius:inherit;} .conv4-arch .ph::before{top:auto;left:50%;bottom:24px;transform:translateX(-50%);} /* conviction: burgundy text link (keeps solid buttons from stacking with the product CTA below) */ .conv4-txt .conv4-link{margin-top:16px;color:#380E0E;border-bottom:1px solid #380E0E;} .conv4-txt .conv4-link:hover{color:#111111;border-bottom-color:#111111;} /* homepage philosophy: same card system as the journal's "How it's made" */ #philo .craftcard{background:#F1F1F1;border:1px solid #F1F1F1;border-top:3px solid #380E0E;border-radius:12px;} #philo .craftcard .cbody{padding:34px 34px 40px;} #philo .craftcard h4{display:flex;align-items:center;gap:12px;color:#111111;white-space:nowrap;} #philo .craftcard h4::before{content:"";width:18px;height:1px;background:#380E0E;flex:none;} #philo .sec-head h2{max-width:22ch;margin-left:auto;margin-right:auto;text-wrap:balance;} /* philosophy back on black; journal-style cards in white */ #philo .sec-head .label{color:#FFFFFF;} #philo .sec-head .label::before{background:#380E0E!important;box-shadow:0 0 0 1px rgba(255,255,255,.35);display:block!important;} #philo .sec-head h2{color:#FFFFFF;} #philo .craftcard{background:#FFFFFF;border:1px solid #FFFFFF;border-top:3px solid #380E0E;} #philo .craftcard h4{color:#111111;} #philo .craftcard p{color:#5E5E5E;} #philo .cimg{background:#E6E6E6;} /* philosophy cards: dark, as before, in the journal card style */ #philo .craftcard{background:#1A1A1A;border:1px solid rgba(255,255,255,.12);border-top:3px solid #380E0E;} #philo .craftcard h4{color:#FFFFFF;} #philo .craftcard h4::before{background:#FFFFFF;opacity:.6;} #philo .craftcard p{color:#BDBDBD;} #philo .cimg{background:#2A2A2A;} #philo .cimg .ph{background:repeating-linear-gradient(135deg,#2A2A2A 0 14px,#242424 14px 28px);color:#9A9A9A;outline:0;} /* four beliefs: icon column + one text column (title and line share one left edge) */ .b4c{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;column-gap:24px!important;row-gap:12px!important;align-items:center!important;align-content:center!important;padding:48px 52px!important;min-height:0!important;} .b4c .hd{display:contents!important;} .b4c .ico{grid-column:1;grid-row:1/span 2;align-self:start;margin:0!important;} .b4c h3{grid-column:2;grid-row:1;margin:0!important;padding:0!important;align-self:end;} .b4c > p{grid-column:2;grid-row:2;margin:0!important;padding:0!important;align-self:start;} .hero-full .btn{white-space:nowrap;} /* ===== global e-commerce additions ===== */ /* currency switcher */ .cur{position:relative;display:flex;align-items:center;margin-right:4px;} .cur-btn{display:flex;align-items:center;gap:8px;height:36px;padding:0 14px;border:1px solid #DADADA;border-radius:999px;background:transparent;color:#111;font:500 11.5px/1 var(--mono);letter-spacing:.12em;cursor:pointer;transition:border-color .2s;} .cur-btn::after{content:"";width:6px;height:6px;border-right:1.4px solid #111;border-bottom:1.4px solid #111;transform:translateY(-2px) rotate(45deg);} .cur-btn:hover,.cur.open .cur-btn{border-color:#111;} .cur-menu{position:absolute;right:0;top:calc(100% + 12px);width:280px;background:#fff;border:1px solid #DADADA;border-radius:14px;box-shadow:0 18px 44px rgba(17,17,17,.12);padding:8px;display:none;z-index:80;} .cur.open .cur-menu{display:block;} .cur-menu button{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:44px;padding:0 14px;border:0;background:none;border-radius:8px;font:15px/1.2 var(--sans);color:#111;cursor:pointer;text-align:left;} .cur-menu button:hover{background:#F1F1F1;} .cur-menu button.on{color:#380E0E;font-weight:600;} .cur-menu button.on::after{content:"";width:7px;height:7px;border-radius:50%;background:#380E0E;flex:none;} .cur-menu p{font-size:12.5px;line-height:1.55;color:#5E5E5E;padding:12px 14px 8px;margin:6px 0 0;border-top:1px solid #EAEAEA;} @media (pointer:coarse) and (max-width:600px){ .cur-btn{height:34px;padding:0 10px;font-size:10.5px;} .cur-menu{width:260px;right:-60px;} } /* footer newsletter */ .foot-news{margin:0 0 30px;max-width:400px;} .foot-news label{display:block;font-size:14.5px;line-height:1.5;color:rgba(255,255,255,.72);margin-bottom:12px;} .foot-news .row{display:flex;align-items:center;border-bottom:1px solid rgba(255,255,255,.35);transition:border-color .2s;} .foot-news .row:focus-within{border-bottom-color:#FFFFFF;} .foot-news input{flex:1;min-width:0;background:transparent;border:0;color:#fff;font:16px/1 var(--sans);padding:13px 0;outline:none;} .foot-news input::placeholder{color:rgba(255,255,255,.45);} .foot-news button{background:none;border:0;color:#fff;font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;padding:13px 0 13px 18px;} .foot-news button:disabled{opacity:.6;cursor:default;} .foot-news .ok,.foot-news .bad{display:none;font-size:14px;margin:12px 0 0;} .foot-news .ok{color:#fff;} .foot-news .bad{color:#E8B4B4;} .foot-news.err .bad{display:block;} .foot-news.err .row{border-bottom-color:#E8B4B4;} .foot-news.done label,.foot-news.done .row,.foot-news.done .bad{display:none;} .foot-news.done .ok{display:block;} /* footer payment chips */ .foot-base{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;} .foot-pay{display:flex;gap:6px;flex-wrap:wrap;} .foot-pay i{font:normal 500 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.22);border-radius:4px;padding:6px 8px;} @media (pointer:coarse) and (max-width:760px){ .foot-base{flex-direction:column;align-items:flex-start;gap:16px;} } /* sticky add-to-cart (journal) */ .sbar{position:fixed;left:0;right:0;bottom:0;z-index:70;background:rgba(255,255,255,.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid #DADADA;box-shadow:0 -10px 30px rgba(17,17,17,.06);transform:translateY(105%);transition:transform .4s cubic-bezier(.2,.7,.2,1);} .sbar.on{transform:none;} .sbar .container{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:78px;} .sbar .nm{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:15px;letter-spacing:.01em;color:#111;} .sbar .mt{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#5E5E5E;margin-top:7px;} .sbar .r{display:flex;align-items:center;gap:24px;} .sbar .pr{font-family:var(--head);font-weight:300;font-size:20px;color:#111;white-space:nowrap;} .sbar .pr small{font-size:13px;color:#5E5E5E;text-decoration:line-through;margin-left:10px;} .sbar .btn{padding:16px 40px;white-space:nowrap;} @media (pointer:coarse) and (max-width:640px){ .sbar .mt,.sbar .pr small{display:none;} .sbar .container{min-height:68px;gap:14px;} .sbar .nm{font-size:13px;} .sbar .r{gap:14px;} .sbar .pr{font-size:17px;} .sbar .btn{padding:14px 24px;} } /* currency: no switcher; small note on the product page */ .cur{display:none!important;} .cur-note{font-size:13px;line-height:1.5;color:#5E5E5E;margin:-6px 0 18px;} /* footer newsletter: its own band above the link columns */ .foot-news-band{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:end;padding-bottom:56px;margin-bottom:64px;border-bottom:1px solid rgba(255,255,255,.14);} .fnb-h{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(24px,2.4vw,32px);line-height:1.1;letter-spacing:-.01em;color:#FFFFFF;margin-bottom:12px;} .fnb-l p{font-size:15px;line-height:1.6;color:rgba(255,255,255,.66);margin:0;} .foot-news-band .foot-news{margin:0;max-width:none;} .foot-news-band .foot-news .row{border-bottom:1px solid rgba(255,255,255,.45);} .foot-news-band .foot-news input{font-size:17px;padding:16px 0;} .foot-news-band .foot-news button{padding:16px 0 16px 24px;font-size:11.5px;} .foot-news-band .foot-news button::after{content:" \2192";} @media (pointer:coarse) and (max-width:760px){ .foot-news-band{grid-template-columns:1fr;gap:24px;padding-bottom:40px;margin-bottom:44px;} } /* payment logos */ .foot-pay i,.sum-pay i{display:inline-flex;align-items:center;justify-content:center;height:28px;min-width:44px;padding:0 9px;} .foot-pay i img{height:14px;width:auto;display:block;opacity:.85;} .sum-pay i img{height:14px;width:auto;display:block;} .foot-pay i,.sum-pay i{font:normal 600 10.5px/1 var(--sans);letter-spacing:.04em;text-transform:none;} /* newsletter band: title only, centred on the line */ .foot-news-band{align-items:center;} .fnb-h{margin-bottom:0;} /* payment logos: white badges, brand colour, legible size */ .foot-pay,.sum-pay div{gap:8px;} .foot-pay i,.sum-pay i{display:inline-flex;align-items:center;justify-content:center;height:34px;min-width:54px;padding:0 10px;background:#FFFFFF;border:1px solid #FFFFFF;border-radius:6px;color:#111111;font:normal 700 12px/1 var(--sans);letter-spacing:.01em;text-transform:none;} .sum-pay i{border-color:#DADADA;} .foot-pay i img,.sum-pay i img{height:20px;width:auto;opacity:1;display:block;} /* buttons: dark buttons are burgundy; hover never hides the label */ .btn-dark{background:#380E0E!important;border-color:#380E0E!important;color:#FFFFFF!important;} .btn-dark:hover,.btn-dark:focus-visible{background:#111111!important;border-color:#111111!important;color:#FFFFFF!important;} /* cart drawer footer */ .cart-foot{padding:26px 28px 28px;} .cart-foot .sub{font-size:17px;margin-bottom:8px;} .cart-foot .note{font-size:14px;color:#5E5E5E;margin-bottom:20px;} .cart-foot .btn{height:60px;font-size:12.5px;letter-spacing:.2em;} /* footer newsletter: centred, capsule field */ .foot-news-band{display:flex!important;flex-direction:column;align-items:center;text-align:center;gap:0!important;padding:16px 0 64px!important;} .fnb-k{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.7);margin-bottom:18px;} .fnb-k::before{content:"";width:6px;height:6px;border-radius:50%;background:#380E0E;box-shadow:0 0 0 1px rgba(255,255,255,.4);} .foot-news-band .fnb-h{font-size:clamp(28px,3vw,40px)!important;margin:0 0 32px!important;} .foot-news-band .foot-news{width:100%;max-width:540px;} .foot-news-band .foot-news .row{border:1px solid rgba(255,255,255,.35)!important;border-radius:999px;padding:6px 6px 6px 26px;} .foot-news-band .foot-news .row:focus-within{border-color:#FFFFFF!important;} .foot-news-band .foot-news input{padding:12px 0!important;font-size:16px!important;} .foot-news-band .foot-news button{background:#FFFFFF;color:#111111;border-radius:999px;padding:0 26px!important;height:46px;font-size:11.5px!important;flex:none;transition:background .2s,color .2s;} .foot-news-band .foot-news button::after{content:""!important;} .foot-news-band .foot-news button:hover{background:#380E0E;color:#FFFFFF;} .foot-news-band .ok,.foot-news-band .bad{text-align:center;} @media (pointer:coarse) and (max-width:600px){ .foot-news-band .foot-news .row{padding-left:20px;} .foot-news-band .foot-news button{padding:0 18px!important;} } /* buttons: no change on hover */ .btn-brass:hover,.btn-brass:focus-visible,.btn-dark:hover,.btn-dark:focus-visible,.more-form button:hover,.more-sec .more-form button:hover{background:#380E0E!important;border-color:#380E0E!important;color:#FFFFFF!important;filter:none!important;transform:none!important;box-shadow:none!important;opacity:1!important;} .foot-news-band .foot-news button:hover{background:#FFFFFF!important;color:#111111!important;} /* footer v3: newsletter box | three link columns; email + social in the base row */ .foot-top{display:grid!important;grid-template-columns:minmax(0,1.1fr) minmax(0,1.4fr)!important;gap:clamp(48px,7vw,120px)!important;align-items:start;} .foot-cols{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:32px!important;} .foot-nbox{border:1px solid rgba(255,255,255,.16);border-radius:18px;padding:36px 36px 34px;background:rgba(255,255,255,.03);max-width:480px;} .foot-nbox .fnb-k{margin-bottom:16px;} .foot-nbox .fnb-h{font-family:var(--head);font-weight:300;text-transform:uppercase;font-size:clamp(22px,2.1vw,28px);line-height:1.12;letter-spacing:-.01em;color:#FFFFFF;margin:0 0 28px;} .foot-nbox .foot-news{margin:0;max-width:none;} .foot-nbox .foot-news .row{border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:5px 5px 5px 22px;} .foot-nbox .foot-news .row:focus-within{border-color:#FFFFFF;} .foot-nbox .foot-news input{padding:11px 0;font-size:15.5px;} .foot-nbox .foot-news button{background:#FFFFFF;color:#111111;border-radius:999px;height:44px;padding:0 22px;font-size:11px;flex:none;} .foot-nbox .foot-news button:hover{background:#FFFFFF;color:#111111;} .foot-nbox .foot-news .ok,.foot-nbox .foot-news .bad{margin-top:14px;} .foot-end{display:flex;align-items:center;gap:28px;} .foot-end .foot-social{display:flex;gap:10px;margin:0;} .foot-end .foot-social a{width:38px;height:38px;} @media (pointer:coarse) and (max-width:900px){ .foot-top{grid-template-columns:1fr!important;gap:44px!important;} .foot-nbox{max-width:none;} } @media (pointer:coarse) and (max-width:600px){ .foot-cols{grid-template-columns:1fr 1fr!important;} .foot-nbox{padding:28px 24px;} .foot-end{flex-direction:column;align-items:flex-start;gap:16px;} } /* footer newsletter v4: editorial, no box, underline field + arrow */ .foot-nbox{border:0!important;background:none!important;padding:0!important;border-radius:0!important;max-width:440px!important;} .foot-nbox .fnb-k{margin-bottom:22px!important;} .foot-nbox .fnb-k::before{background:#380E0E!important;box-shadow:none!important;width:7px;height:7px;} .foot-nbox .fnb-h{font-size:clamp(28px,2.8vw,38px)!important;line-height:1.05!important;margin:0 0 36px!important;max-width:12ch;} .foot-nbox .foot-news .row{border:0!important;border-bottom:1px solid rgba(255,255,255,.4)!important;border-radius:0!important;padding:0!important;} .foot-nbox .foot-news .row:focus-within{border-bottom-color:#FFFFFF!important;} .foot-nbox .foot-news input{padding:16px 0!important;font-size:16.5px!important;} .foot-nbox .foot-news button,.foot-nbox .foot-news button:hover{background:none!important;color:#FFFFFF!important;height:auto!important;padding:10px 0 10px 16px!important;border-radius:0!important;} .foot-nbox .foot-news button svg{width:22px;height:22px;stroke:#FFFFFF;fill:none;stroke-width:1.4;display:block;transition:transform .3s ease;} .foot-nbox .foot-news button:hover svg{transform:translateX(4px);} .foot-nbox .foot-news .fine{font-size:13px;line-height:1.5;color:rgba(255,255,255,.5);margin:14px 0 0;} .foot-nbox .foot-news.done .fine{display:none;} /* newsletter v5: label = column heading size, smaller title, white field + burgundy button */ .foot-nbox .fnb-k{font-family:var(--mono)!important;font-size:13.5px!important;font-weight:500!important;letter-spacing:.2em!important;color:rgba(255,255,255,.5)!important;margin-bottom:22px!important;gap:10px;} .foot-nbox .fnb-h{font-size:clamp(22px,2vw,26px)!important;line-height:1.15!important;margin:0 0 28px!important;max-width:none!important;} .foot-nbox .foot-news .row:focus-within{box-shadow:0 0 0 3px rgba(255,255,255,.18);} .foot-nbox .foot-news input{color:#111111!important;padding:13px 0!important;font-size:16px!important;} .foot-nbox .foot-news button,.foot-nbox .foot-news button:hover{background:#380E0E!important;color:#FFFFFF!important;border-radius:8px!important;width:50px;height:50px!important;padding:0!important;display:flex;align-items:center;justify-content:center;flex:none;} .foot-nbox .foot-news button svg{width:20px!important;height:20px!important;stroke:#FFFFFF!important;} .foot-nbox .foot-news button:hover svg{transform:none!important;} /* newsletter v6: underline field, block spans the link columns' height so the line lands on the "Contact" row */ .foot-top{align-items:stretch!important;} .foot-nbox{display:flex!important;flex-direction:column!important;max-width:420px!important;} .foot-nbox .fnb-h{font-family:var(--sans)!important;font-weight:400!important;text-transform:none!important;letter-spacing:0!important;font-size:18px!important;line-height:1.45!important;color:rgba(255,255,255,.82)!important;margin:0 0 20px!important;} .foot-nbox .foot-news{margin-top:auto!important;} .foot-nbox .foot-news .row{background:none!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.45)!important;border-radius:0!important;padding:0 0 10px!important;box-shadow:none!important;} .foot-nbox .foot-news .row:focus-within{border-bottom-color:#FFFFFF!important;box-shadow:none!important;} .foot-nbox .foot-news input{color:#FFFFFF!important;padding:8px 0!important;font-size:16px!important;} .foot-nbox .foot-news input::placeholder{color:rgba(255,255,255,.5)!important;} .foot-nbox .foot-news button,.foot-nbox .foot-news button:hover{width:38px!important;height:38px!important;border-radius:50%!important;background:#380E0E!important;padding:0!important;} .foot-nbox .foot-news button svg{width:17px!important;height:17px!important;} .foot-nbox .foot-news .ok{font-size:15px;color:rgba(255,255,255,.82);margin:0;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.45);} @media (pointer:coarse) and (max-width:900px){ .foot-nbox .foot-news{margin-top:8px!important;} } /* newsletter v7: white field + burgundy button restored; success state shares the field shape */ .foot-nbox .foot-news .row{background:#FFFFFF!important;border:0!important;border-radius:10px!important;padding:6px 6px 6px 20px!important;} .foot-nbox .foot-news .row:focus-within{box-shadow:0 0 0 3px rgba(255,255,255,.18)!important;} .foot-nbox .foot-news input{color:#111111!important;padding:13px 0!important;} .foot-nbox .foot-news input::placeholder{color:#8C8C8C!important;} .foot-nbox .foot-news button,.foot-nbox .foot-news button:hover{width:50px!important;height:50px!important;border-radius:8px!important;background:#380E0E!important;} .foot-nbox .foot-news button svg{width:20px!important;height:20px!important;} .foot-nbox .foot-news .ok{display:none;align-items:center;gap:14px;min-height:62px;padding:6px 20px 6px 8px!important;margin:0!important;background:#FFFFFF;border:0!important;border-radius:10px;color:#111111!important;font-size:15px!important;line-height:1.4;} .foot-nbox .foot-news .ok::before{content:"";flex:none;width:50px;height:50px;border-radius:8px;background:#380E0E url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/20px no-repeat;} .foot-nbox .foot-news.done .ok{display:flex!important;} .foot-nbox .foot-news .bad{color:#F2C4C4!important;margin-top:10px!important;} .foot-nbox .foot-news .ok{max-width:none!important;width:100%!important;box-sizing:border-box!important;} .foot-nbox .fnb-k::before{width:6px!important;height:6px!important;background:#380E0E!important;box-shadow:0 0 0 1px rgba(255,255,255,.35)!important;} /* shop: trust band */ .trust-band{padding:88px 0!important;} .tb-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));} .tb{padding:0 36px;border-left:1px solid rgba(255,255,255,.14);} .tb:first-child{padding-left:0;border-left:0;} .tb:last-child{padding-right:0;} .tb svg{width:26px;height:26px;stroke:#FFFFFF;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;margin-bottom:26px;display:block;} .tb h3{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:16px;letter-spacing:.02em;line-height:1.25;color:#FFFFFF;margin:0 0 10px;} .tb p{font-size:15px;line-height:1.6;color:rgba(255,255,255,.72);margin:0;max-width:24ch;} @media (pointer:coarse) and (max-width:900px){ .tb-grid{grid-template-columns:1fr 1fr;row-gap:44px;} .tb:nth-child(3){padding-left:0;border-left:0;} } @media (pointer:coarse) and (max-width:560px){ .trust-band{padding:60px 0!important;} .tb-grid{grid-template-columns:1fr;row-gap:32px;} .tb{padding:0;border-left:0;} } .tb h3{white-space:nowrap;} @media (pointer:coarse) and (max-width:560px){ .tb h3{white-space:normal;} } /* cart empty state */ .cart-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:72px 12px 0;} .cart-empty .ce-ico{width:64px;height:64px;border-radius:50%;background:#F1F1F1;display:flex;align-items:center;justify-content:center;margin-bottom:24px;} .cart-empty .ce-ico svg{width:24px;height:24px;stroke:#380E0E;fill:none;stroke-width:1.4;} .cart-empty h4{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:18px;letter-spacing:.01em;color:#111;margin:0 0 10px;} .cart-empty p{font-size:15px;line-height:1.6;color:#5E5E5E;margin:0;max-width:28ch;} /* shop trust band v2: centred, icon discs, no dividers */ .tb-grid{gap:32px;} .tb{padding:0!important;border:0!important;text-align:center;display:flex;flex-direction:column;align-items:center;} .tb svg{width:24px!important;height:24px!important;margin:0!important;} .tb{position:relative;} .tb::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:64px;height:64px;border-radius:50%;border:1px solid rgba(255,255,255,.22);} .tb svg{margin:20px 0 34px!important;position:relative;} .tb h3{font-size:17px!important;margin-bottom:10px!important;} .tb p{margin:0 auto!important;max-width:22ch!important;} /* more to come v2: centred stack with a capsule field */ .more2{padding:clamp(96px,10vw,140px) 0!important;} .m2{max-width:640px;margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center;} .m2 .label{margin-bottom:18px;} .m2 h2{margin:0 0 20px;} .m2>p{font-size:17px;line-height:1.65;color:#3A3A3A;margin:0 0 40px;max-width:46ch;text-wrap:balance;} .m2-form{width:100%;max-width:520px;} .m2-row{display:flex;align-items:center;background:#FFFFFF;border:1px solid #DADADA;border-radius:999px;padding:6px 6px 6px 26px;transition:border-color .2s,box-shadow .2s;} .m2-row:focus-within{border-color:#380E0E;box-shadow:0 0 0 3px rgba(56,14,14,.1);} .m2-row input{flex:1;min-width:0;border:0;outline:none;background:transparent;font:16px/1 var(--sans);color:#111;padding:14px 0;} .m2-row input::placeholder{color:#8C8C8C;} .m2-row button{flex:none;height:50px;padding:0 28px;border:0;border-radius:999px;background:#380E0E;color:#FFFFFF;font:500 11.5px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;cursor:pointer;} .m2-ok,.m2-bad{display:none;font-size:15px;margin-top:14px;} .m2-ok{color:#111;} .m2-bad{color:#9B2C2C;} .m2-form.err .m2-bad{display:block;} .m2-form.err .m2-row{border-color:#9B2C2C;} .m2-form.done .m2-row,.m2-form.done .m2-bad{display:none;} .m2-form.done .m2-ok{display:flex;align-items:center;justify-content:center;gap:12px;min-height:64px;margin:0;background:#FFFFFF;border:1px solid #DADADA;border-radius:999px;} .m2-form.done .m2-ok::before{content:"";width:26px;height:26px;border-radius:50%;background:#380E0E url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/16px no-repeat;} @media (pointer:coarse) and (max-width:560px){ .m2-row{padding-left:18px;} .m2-row button{padding:0 18px;} } /* shop: trust strip under the product panel */ .feat-shop{margin-bottom:0!important;} .ts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin-top:48px;padding-top:40px;border-top:1px solid #DADADA;} .ts-h{display:flex;align-items:center;gap:12px;margin-bottom:10px;} .ts-h svg{width:22px;height:22px;stroke:#380E0E;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none;} .ts-h h3{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:15px;letter-spacing:.02em;color:#111;margin:0;white-space:nowrap;} .ts-i p{font-size:15px;line-height:1.55;color:#5E5E5E;margin:0;padding-left:34px;} @media (pointer:coarse) and (max-width:900px){ .ts{grid-template-columns:1fr 1fr;row-gap:28px;} } @media (pointer:coarse) and (max-width:520px){ .ts{grid-template-columns:1fr;} } /* shop: trust as its own section (scales with more products) */ .trust2{padding:clamp(80px,8vw,112px) 0!important;} .ts2{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;} .ts2-i{background:#FFFFFF;border-radius:14px;padding:34px 30px 36px;display:flex;flex-direction:column;align-items:flex-start;} .ts2-ic{width:52px;height:52px;border-radius:50%;background:#F1F1F1;display:flex;align-items:center;justify-content:center;margin-bottom:28px;} .ts2-ic svg{width:22px;height:22px;stroke:#380E0E;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;} .ts2-i h3{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:16px;letter-spacing:.02em;line-height:1.2;color:#111;margin:0 0 10px;white-space:nowrap;} .ts2-i p{font-size:15px;line-height:1.6;color:#5E5E5E;margin:0;} @media (pointer:coarse) and (max-width:900px){ .ts2{grid-template-columns:1fr 1fr;} } @media (pointer:coarse) and (max-width:520px){ .ts2{grid-template-columns:1fr;} .ts2-i h3{white-space:normal;} } /* shop: more to come v3, spacious split panel */ .more3{padding:clamp(112px,11vw,160px) 0!important;} .m3{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(48px,7vw,112px);align-items:center;background:#F1F1F1;border-radius:24px;padding:clamp(56px,7vw,104px) clamp(40px,6vw,96px);} .m3-l .label{margin-bottom:22px;} .m3-l h2{margin:0;max-width:10ch;line-height:1.02;} .m3-r p{font-size:17px;line-height:1.7;color:#3A3A3A;margin:0 0 32px;max-width:44ch;} .m3-r .m2-form{max-width:none;} @media (pointer:coarse) and (max-width:860px){ .m3{grid-template-columns:1fr;gap:28px;} .m3-l h2{max-width:none;} } /* shop trust v3: split section, heading left, 2×2 tiles right */ .trust3{padding:clamp(96px,10vw,140px) 0!important;} .t3w{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(48px,7vw,104px);align-items:center;} .t3l .label{margin-bottom:18px;} .t3l h2{margin:0 0 22px;max-width:10ch;} .t3l p{font-size:17px;line-height:1.65;color:#3A3A3A;margin:0;max-width:34ch;} .t3g{display:grid;grid-template-columns:1fr 1fr;gap:20px;} .t3i{background:#FFFFFF;border-radius:16px;padding:32px 30px 34px;} .t3c{width:48px;height:48px;border-radius:50%;border:1px solid #E2D6D6;display:flex;align-items:center;justify-content:center;margin-bottom:26px;} .t3c svg{width:21px;height:21px;stroke:#380E0E;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;} .t3i h3{font-family:var(--head);font-weight:400;text-transform:uppercase;font-size:16px;letter-spacing:.02em;color:#111;margin:0 0 10px;white-space:nowrap;} .t3i p{font-size:15px;line-height:1.6;color:#5E5E5E;margin:0;} @media (pointer:coarse) and (max-width:900px){ .t3w{grid-template-columns:1fr;gap:40px;} .t3l h2{max-width:none;} } @media (pointer:coarse) and (max-width:520px){ .t3g{grid-template-columns:1fr;} .t3i h3{white-space:normal;} } /* shop CTA: same band as other pages, email field in place of the button */ .cta-form{margin:36px auto 0;max-width:520px;width:100%;} /* about: who-facts eyebrow (dt) a touch larger */ .who-facts dt{font-size:12.5px!important;letter-spacing:.16em!important;} /* about: what drives us cards, burgundy touch */ .sec-dark .road .item{border-top:3px solid #380E0E!important;} .sec-dark .road .item .no{color:#FFFFFF!important;} .sec-dark .road .item h4{display:flex;align-items:center;gap:12px;} .sec-dark .road .item h4::before{content:"";width:18px;height:1px;background:#FFFFFF;opacity:.6;flex:none;} /* what drives us: burgundy you can actually see on black */ .sec-dark .road .item{border-top:1px solid rgba(255,255,255,.14)!important;} .sec-dark .road .item .no{display:inline-flex!important;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:#380E0E!important;color:#FFFFFF!important;box-shadow:0 0 0 1px rgba(255,255,255,.35);font-size:15px!important;line-height:1!important;margin-bottom:28px!important;} /* what drives us: calmer cards, uppercase titles, no dash, more air */ .sec-dark .road .item{padding:48px 48px 44px!important;} .sec-dark .road .item .no{margin-bottom:44px!important;} .sec-dark .road .item h4{display:block!important;font-family:var(--head)!important;font-weight:400!important;text-transform:uppercase!important;font-size:20px!important;letter-spacing:.02em!important;color:#FFFFFF!important;margin:0 0 16px!important;} .sec-dark .road .item h4::before{content:none!important;display:none!important;} .sec-dark .road .item p{font-size:16px!important;line-height:1.7!important;margin-bottom:36px!important;} .sec-dark .road{gap:28px!important;} /* shop CTA title: one line like the other pages */ .cta-band h2.h-lg{max-width:none;} @media (min-width:761px){ .cta-band h2.h-lg{white-space:nowrap;} } /* shop trust: centred section, heading on top, four tiles in a row */ .t3w{grid-template-columns:1fr!important;gap:56px!important;} .t3l{text-align:center;display:flex;flex-direction:column;align-items:center;} .t3l h2{max-width:none!important;} .t3l p{max-width:46ch!important;} .t3g{grid-template-columns:repeat(4,minmax(0,1fr))!important;} @media (pointer:coarse) and (max-width:900px){ .t3g{grid-template-columns:1fr 1fr!important;} } @media (pointer:coarse) and (max-width:520px){ .t3g{grid-template-columns:1fr!important;} } .t3l h2{margin-bottom:0!important;} /* trust tiles: centred, solid burgundy icon discs */ .t3i{text-align:center;display:flex;flex-direction:column;align-items:center;padding:40px 28px 40px!important;} .t3c{width:56px!important;height:56px!important;background:#380E0E!important;border:0!important;margin-bottom:28px!important;} .t3c svg{stroke:#FFFFFF!important;width:22px!important;height:22px!important;} .t3i p{max-width:24ch;} .t3i p{max-width:none!important;white-space:nowrap;} @media (pointer:coarse) and (max-width:520px){ .t3i p{white-space:normal;} } .nx-c{border:0!important;border-top:3px solid #380E0E!important;box-shadow:inset 0 3px 0 #380E0E;} /* philosophy cards: brand dot instead of dash; visible burgundy edge */ #philo .craftcard h4::before{content:""!important;width:7px!important;height:7px!important;border-radius:50%;background:#380E0E!important;box-shadow:0 0 0 1px rgba(255,255,255,.4);opacity:1!important;} #philo .craftcard h4{gap:14px!important;} #philo .craftcard{border-top:1px solid rgba(255,255,255,.12)!important;} /* philosophy cards: hang the dot in the margin so title and text share one left edge */ #philo .craftcard h4{display:block!important;position:relative;} #philo .craftcard h4::before{position:absolute;left:-20px;top:50%;transform:translateY(-50%);} /* philosophy cards: burgundy top edge back, no dot */ #philo .craftcard{border-top:3px solid #380E0E!important;} #philo .craftcard h4::before{content:none!important;display:none!important;} /* about belief: arch + capsule brand mark instead of a product image */ .belief{display:flex;flex-direction:column;align-items:center;} .belief-mark{display:flex;align-items:flex-end;gap:10px;margin-bottom:36px;} .bm-arch{width:44px;height:58px;border:1.5px solid #380E0E;border-bottom:0;border-radius:999px 999px 0 0;} .bm-cap{width:22px;height:40px;border-radius:999px;background:#380E0E;} .belief .label{margin-bottom:30px;} .belief .belief-q{margin-top:0;} /* belief quote: first sentence on its own line, second balanced beneath */ .belief .belief-q{max-width:30ch!important;margin-left:auto;margin-right:auto;text-wrap:balance;} .belief .belief-q .l1{display:block;color:#111111;margin-bottom:.15em;} @media (min-width:761px){ .belief .belief-q .l1{white-space:nowrap;} } /* about belief: full-bleed image background, more air */ .belief-bg{position:relative;overflow:hidden;padding:clamp(140px,14vw,220px) 0;background:#111;} .belief-bg .bb-img{position:absolute;inset:0;} .belief-bg .bb-img .ph{width:100%;height:100%;} .belief-bg::after{content:"";position:absolute;inset:0;background:rgba(17,17,17,.55);pointer-events:none;} .belief-bg .belief{position:relative;z-index:1;} .belief-bg .belief-q,.belief-bg .belief-q .l1{color:#FFFFFF!important;} .belief-bg .belief-q span:not(.l1){color:rgba(255,255,255,.78)!important;} /* account modal: newsletter opt-in */ .acc-news{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.5;color:#3A3A3A;margin:4px 0 18px;cursor:pointer;} .acc-news input{width:17px;height:17px;margin:2px 0 0;accent-color:#380E0E;flex:none;} .announce .sep{opacity:1!important;color:#FFFFFF!important;} /* footer newsletter field: same soft white as the footer links */ .foot-nbox .foot-news .row,.foot-nbox .foot-news .ok{background:#D4D4D4!important;} .foot-nbox .foot-news input::placeholder{color:#5E5E5E!important;} /* footer newsletter field v8: dark field, thin soft-white outline */ .foot-nbox .foot-news .row,.foot-nbox .foot-news .ok{background:transparent!important;border:1px solid rgba(255,255,255,.32)!important;box-shadow:none!important;} .foot-nbox .foot-news .row:focus-within{border-color:rgba(255,255,255,.75)!important;} .foot-nbox .foot-news input{color:#FFFFFF!important;} .foot-nbox .foot-news input::placeholder{color:rgba(255,255,255,.45)!important;} .foot-nbox .foot-news .ok{color:rgba(255,255,255,.85)!important;} /* logo: one fixed size, no resize on scroll */ .nav .brand img,.nav.scrolled .brand img{height:21px!important;transition:none!important;} @media (pointer:coarse) and (max-width:760px){ .nav .brand img,.nav.scrolled .brand img{height:18px!important;} } .nav .brand img,.nav.scrolled .brand img{height:18px!important;} @media (pointer:coarse) and (max-width:760px){ .nav .brand img,.nav.scrolled .brand img{height:16px!important;} } /* ============ cookie consent ============ */ .ck{position:fixed;left:24px;bottom:24px;z-index:900;width:min(440px,calc(100vw - 32px));background:#fff;border:1px solid #DADADA;border-radius:12px;box-shadow:0 24px 60px -18px rgba(17,17,17,.28);padding:28px 28px 24px;font-family:"Hanken Grotesk",system-ui,sans-serif;color:#111;opacity:0;transform:translateY(16px);transition:opacity .45s cubic-bezier(.2,.7,.2,1),transform .45s cubic-bezier(.2,.7,.2,1);pointer-events:none;} .ck.on{opacity:1;transform:none;pointer-events:auto;} .ck .ey{display:flex;align-items:center;gap:9px;font:500 11.5px/1 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.2em;text-transform:uppercase;margin-bottom:14px;} .ck .ey::before{content:"";width:6px;height:6px;border-radius:50%;background:#380E0E;} .ck h3{font-family:"Sora",system-ui,sans-serif;font-weight:300;text-transform:uppercase;font-size:20px;line-height:1.15;letter-spacing:-.01em;margin:0 0 10px;} .ck p{font-size:14.5px;line-height:1.6;color:#5E5E5E;margin:0;} .ck p a{color:#380E0E;border-bottom:1px solid rgba(56,14,14,.35);text-decoration:none;} .ck .acts{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap;} .ck button{font:500 10.5px/1 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.16em;text-transform:uppercase;padding:14px 18px;border-radius:2px;cursor:pointer;border:1px solid #111;background:transparent;color:#111;flex:1;white-space:nowrap;min-height:44px;} .ck button.pri{background:#380E0E;border-color:#380E0E;color:#fff;} .ck button.lnk{flex:0 0 100%;border:0;padding:10px 0 0;min-height:0;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#C4C4C4;color:#5E5E5E;} .ck button:focus-visible{outline:2px solid #380E0E;outline-offset:2px;} .ck .opts{display:none;margin-top:18px;border-top:1px solid #DADADA;} .ck.set .opts{display:block;} .ck.set .lnk{display:none;} .ck .op{display:grid;grid-template-columns:1fr auto;gap:4px 16px;align-items:center;padding:14px 0;border-bottom:1px solid #EBEBEB;} .ck .op b{font-family:"Sora",system-ui,sans-serif;font-weight:400;text-transform:uppercase;font-size:12.5px;letter-spacing:.01em;} .ck .op b{grid-column:1;grid-row:1;} .ck .op span:not(.sw){grid-column:1;grid-row:2;font-size:13px;line-height:1.5;color:#5E5E5E;} .ck .op .sw{grid-row:1/span 2;grid-column:2;position:relative;width:40px;height:22px;} .ck .sw input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer;z-index:1;} .ck .sw i{position:absolute;inset:0;border-radius:999px;background:#C4C4C4;transition:background .25s;} .ck .sw i::after{content:"";position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .25s cubic-bezier(.2,.7,.2,1);} .ck .sw input:checked+i{background:#380E0E;} .ck .sw input:checked+i::after{transform:translateX(18px);} .ck .sw input:disabled+i{background:#8C8C8C;opacity:.55;} .ck .sw input:focus-visible+i{outline:2px solid #380E0E;outline-offset:2px;} @media(max-width:560px){ .ck{left:12px;right:12px;bottom:12px;width:auto;padding:22px 20px 18px;} .ck h3{font-size:18px;} .ck .acts{flex-direction:column;} .ck button{flex:none;width:100%;} } @media(prefers-reduced-motion:reduce){ .ck,.ck .sw i,.ck .sw i::after{transition:none;} } /* footer link columns spread to the container edge: first column fixed, last column's text ends on the right margin (wordmark edge) */ @media (pointer:fine),(min-width:901px){ .foot-v2 .foot-cols{grid-template-columns:auto auto auto !important;justify-content:space-between !important;} } /* footer copyright line: 1px larger */ .foot-base>span:first-child{font-size:12px !important;} @media (pointer:coarse) and (max-width:400px){.foot-base>span:first-child{font-size:11px !important;}}