/* SOCIUS final visual refinement pass */

/* Campaign mosaic: give all three products an editorial moment. */
.campaign-mosaic{grid-template-columns:1.3fr .85fr .85fr;gap:14px;min-height:610px}
.campaign-mosaic .campaign-shot{min-height:0;border-radius:26px;overflow:hidden;background:#d8d0c5}
.campaign-mosaic .campaign-shot img{width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .45s ease}
.campaign-mosaic .campaign-shower img{transform:scale(.955);object-position:center 45%;filter:contrast(1.055) saturate(.97)}
.campaign-mosaic .campaign-shower:hover img{transform:scale(.97)}
.campaign-mosaic .campaign-am img{object-position:center 48%;filter:contrast(1.025) saturate(.98)}
.campaign-mosaic .campaign-pm img{object-position:center 50%;filter:contrast(1.035) saturate(.96)}
.campaign-mosaic .campaign-am:hover img,.campaign-mosaic .campaign-pm:hover img{transform:scale(1.025)}

/* Purchase controls feel like one intentional module rather than loose form fields. */
.product-copy .addrow{margin-top:34px;padding:14px;border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.5);box-shadow:0 18px 44px rgba(0,0,0,.055);grid-template-columns:minmax(0,1fr) 88px;align-items:stretch;backdrop-filter:blur(10px)}
.product-copy .addrow .pill-dark{border-radius:17px;min-height:56px;font-size:13px;letter-spacing:.035em}
.product-copy .qty{border-radius:17px;background:rgba(247,244,239,.82);padding:0 15px;min-height:56px;text-align:center;font-weight:600}
.product-copy .review-strip{margin-top:18px;padding-top:22px;border-top:1px solid var(--line)}
.product-copy .spec strong{font-weight:600;text-align:right}
.product-copy .lede{max-width:540px}
.product-copy h1{margin-bottom:24px}

/* Give each product page a slightly different atmosphere without changing the brand. */
.product-detail:has(.product-copy h1:first-of-type){isolation:isolate}
body:has(.product-copy h1) .header{backdrop-filter:saturate(1.05)}
.product-visual{overflow:hidden}
.product-visual:after{content:""!important;display:block!important;position:absolute;left:18%;right:18%;bottom:10%;height:16%;background:radial-gradient(ellipse at center,rgba(0,0,0,.12),transparent 68%);filter:blur(25px);pointer-events:none;z-index:0}
.product-visual img{position:relative;z-index:1}

/* Footer */
.site-footer{padding:76px 5vw 28px;background:#eee8df;color:#171614;border-top:1px solid var(--line)}
.site-footer-dark{background:#11100f;color:#eee8df;border-top-color:rgba(255,255,255,.12)}
.footer-brand{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;padding-bottom:52px;border-bottom:1px solid currentColor;border-color:rgba(18,18,18,.12)}
.site-footer-dark .footer-brand{border-color:rgba(255,255,255,.14)}
.footer-brand>button{border:0;background:transparent;padding:0;font-size:clamp(44px,7vw,96px);font-weight:800;letter-spacing:-.075em;line-height:.85;color:inherit}
.footer-brand>button small{font-size:.12em;letter-spacing:.18em;margin-left:8px;vertical-align:top;position:relative;top:.4em}
.footer-brand p{margin:6px 0 0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.site-footer-dark .footer-brand p{color:#9a9288}
.footer-links{display:grid;grid-template-columns:repeat(3,minmax(130px,1fr));gap:34px;max-width:720px;margin-left:auto;padding:44px 0 64px}
.footer-links>div{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.footer-links span{font-size:9px;letter-spacing:.16em;color:var(--muted);margin-bottom:7px}
.site-footer-dark .footer-links span{color:#8f877d}
.footer-links button{border:0;background:transparent;padding:0;color:inherit;font-size:14px;text-align:left;transition:opacity .2s ease,transform .2s ease}
.footer-links button:hover{opacity:.62;transform:translateX(3px)}
.footer-bottom{display:flex;justify-content:space-between;gap:24px;padding-top:20px;border-top:1px solid rgba(18,18,18,.12);font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--muted)}
.site-footer-dark .footer-bottom{border-color:rgba(255,255,255,.14);color:#8f877d}

/* Basic legal pages, intentionally simple. */
.legal-page{min-height:72vh}
.legal-page .page-title{margin-bottom:46px}
.legal-copy{max-width:760px;margin-left:auto;font-size:18px;line-height:1.72;color:var(--muted)}
.legal-copy p{margin:0 0 22px}

/* More usable focus states. */
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid currentColor;outline-offset:4px}

/* Mobile art direction instead of simple shrinking. */
@media(max-width:980px){
  .campaign-mosaic{grid-template-columns:1.15fr .85fr;grid-template-rows:360px 360px;min-height:0}
  .campaign-mosaic .campaign-shower{grid-row:1/3}
  .campaign-mosaic .campaign-am,.campaign-mosaic .campaign-pm{min-height:0}
  .product-detail{grid-template-columns:1fr}
  .product-visual{position:relative!important;top:auto!important;min-height:72vh!important;height:auto!important}
  .product-copy{padding-top:64px!important}
  .product-copy .addrow{position:sticky;bottom:14px;z-index:20;box-shadow:0 20px 60px rgba(0,0,0,.12)}
  .footer-links{margin-left:0;max-width:none}
}

@media(max-width:650px){
  .preview-hero-copy h1{font-size:56px!important;max-width:9ch!important}
  .preview-hero-copy p{max-width:320px}
  .preview-stage{height:350px!important}
  .preview-stage .preview-bottle:nth-child(1) img{max-height:83%!important}
  .preview-stage .preview-bottle:nth-child(2) img,.preview-stage .preview-bottle:nth-child(3) img{max-height:72%!important}
  .campaign-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:330px 240px;gap:7px}
  .campaign-mosaic .campaign-shower{grid-column:1/3;grid-row:1}
  .campaign-mosaic .campaign-am,.campaign-mosaic .campaign-pm{grid-row:2}
  .campaign-mosaic .campaign-shower img{transform:none;object-position:center 47%}
  .campaign-mosaic .campaign-shower:hover img{transform:none}
  .campaign-mosaic .campaign-am img,.campaign-mosaic .campaign-pm img{object-position:center 50%}
  .visual-world{padding-top:68px!important;padding-bottom:72px!important}
  .visual-world-head h2{font-size:46px!important}
  .visual-world-card{min-height:320px!important}
  .visual-community .cloud{height:420px!important;border-radius:24px!important}
  .visual-community .bubble{font-size:11px}
  .product-visual{min-height:62vh!important;padding:calc(var(--header) + 12px) 18px 28px!important}
  .product-visual img{height:min(55vh,560px)!important;width:min(78%,480px)!important}
  .product-copy{padding:48px 18px 70px!important}
  .product-copy h1{font-size:72px!important}
  .product-copy .lede{font-size:19px!important}
  .product-copy .addrow{grid-template-columns:1fr 74px;padding:10px;border-radius:20px;bottom:10px}
  .product-copy .addrow .pill-dark,.product-copy .qty{min-height:52px;border-radius:14px}
  .review-strip{grid-template-columns:repeat(3,1fr)!important;gap:8px!important}
  .review-stat strong{font-size:22px!important}
  .review-stat span{font-size:9px!important}
  .site-footer{padding:58px 18px 24px}
  .footer-brand{display:block;padding-bottom:38px}
  .footer-brand>button{font-size:58px}
  .footer-brand p{margin-top:18px}
  .footer-links{grid-template-columns:1fr 1fr;gap:38px 24px;padding:38px 0 48px}
  .footer-links>div:last-child{grid-column:1/3}
  .footer-bottom{flex-direction:column;gap:8px}
  .legal-copy{font-size:16px}
}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition-duration:.001ms!important;transition-delay:0ms!important}
  .reveal{opacity:1!important;transform:none!important}
  .drift{translate:none!important}
}