/* T-Shop v12 — visual finishing pass */
:root{
  --blue-deep:#061a3c;
  --blue-mid:#0b57a5;
  --blue-bright:#118dd3;
  --blue-cyan:#4fc8ff;
  --gold:#e7bf62;
  --gold-soft:#f8dfa0;
}
.site-header{
  position:relative!important;
  top:auto!important;
  background:linear-gradient(135deg,#062a60 0%,#0b4f95 60%,#0c69b8 100%)!important;
  box-shadow:0 10px 24px rgba(2,24,58,.15)!important;
}
.hero{
  min-height:0!important;
  padding:0!important;
  background:
    radial-gradient(circle at 80% 16%,rgba(144,233,255,.88),transparent 24%),
    radial-gradient(circle at 64% 46%,rgba(70,172,255,.34),transparent 30%),
    linear-gradient(145deg,#061936 0%,#0a3f82 40%,#0b78c7 68%,#082b5d 100%)!important;
}
.hero::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(160deg,transparent 0 58%,rgba(5,35,75,.55) 59% 66%,transparent 67%),
    linear-gradient(205deg,transparent 0 62%,rgba(4,29,65,.58) 63% 70%,transparent 71%),
    radial-gradient(circle at 86% 14%,rgba(255,255,255,.44) 0 2%,transparent 3%),
    radial-gradient(circle at 73% 8%,rgba(255,255,255,.38) 0 1.5%,transparent 2.5%),
    radial-gradient(circle at 92% 32%,rgba(255,255,255,.26) 0 1.2%,transparent 2.2%)!important;
  opacity:1!important;
  filter:none!important;
}
.hero::after{
  background:linear-gradient(90deg,rgba(2,17,45,.54),rgba(3,31,72,.18) 48%,rgba(3,31,72,.06))!important;
}
.hero-inner{
  min-height:540px!important;
  grid-template-columns:.88fr 1.12fr!important;
  gap:28px!important;
}
.hero-copy{padding:52px 0 34px!important;max-width:560px!important}
.hero h1{
  font-size:clamp(4rem,6vw,5.9rem)!important;
  letter-spacing:-.04em!important;
  text-shadow:0 6px 28px rgba(1,18,48,.16)!important;
}
.hero-lead{font-size:1.03rem!important;line-height:1.42!important}
.hero-actions .btn{box-shadow:0 12px 26px rgba(1,18,48,.13)}
.hero-merch{
  display:flex!important;
  min-height:455px!important;
  padding:32px 0 18px!important;
  align-items:center!important;
  gap:18px!important;
}
.product-feature{
  width:min(44%,315px)!important;
  max-width:315px!important;
  border-radius:26px!important;
  background:linear-gradient(180deg,#fff,#f7fbff)!important;
  border:2px solid rgba(255,255,255,.94)!important;
  box-shadow:0 28px 64px rgba(2,18,50,.28),0 0 34px rgba(66,183,255,.22)!important;
  overflow:hidden!important;
  transform:none!important;
}
.product-feature:first-child{transform:translateY(16px) rotate(-1.5deg)!important}
.product-feature:last-child{transform:translateY(-12px) rotate(1.5deg)!important}
.product-feature img{aspect-ratio:1/1!important;object-fit:cover!important}
.section-soft{
  background:linear-gradient(180deg,#ffffff 0%,#f7fbff 60%,#eef7ff 100%)!important;
}
.collection-grid{gap:12px!important}
.collection-card{
  border-radius:18px!important;
  box-shadow:0 14px 30px rgba(5,43,94,.13)!important;
  border:1px solid rgba(255,255,255,.9)!important;
}
.collection-card img{filter:saturate(1.08) contrast(1.03)!important}
.collection-card::after{
  background:linear-gradient(180deg,transparent 32%,rgba(2,17,47,.88) 100%)!important;
}
.products{gap:12px!important}
.product-card{
  border-radius:18px!important;
  border:1px solid #d9e8f5!important;
  box-shadow:0 12px 28px rgba(5,42,92,.09)!important;
}
.product-card:hover{transform:translateY(-3px)!important;box-shadow:0 18px 36px rgba(5,42,92,.14)!important}
.product-media{background:#fff!important;padding:6px!important}
.product-media img{object-fit:cover!important}
.trust{
  background:linear-gradient(90deg,#f2f8ff,#fff8e7)!important;
}
.story{
  background:linear-gradient(110deg,#061c42,#0b58a5 62%,#071d48)!important;
}
.journal-section{
  background:linear-gradient(180deg,#f7fbff,#eef6ff)!important;
}
@media(max-width:700px){
  .promo .container{font-size:.74rem!important}
  .nav{min-height:70px!important;padding:7px 0!important}
  .hero-inner{
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    gap:0!important;
  }
  .hero-copy{order:1!important;padding:20px 0 6px!important;max-width:none!important}
  .eyebrow{font-size:.59rem!important;letter-spacing:.14em!important}
  .hero h1{
    font-size:clamp(2.65rem,10.8vw,3.55rem)!important;
    line-height:.9!important;
    max-width:92%!important;
    margin:5px 0 9px!important;
  }
  .hero-lead{
    font-size:.86rem!important;
    line-height:1.35!important;
    max-width:96%!important;
  }
  .hero-actions{
    grid-template-columns:1.15fr .85fr!important;
    gap:8px!important;
    margin-top:12px!important;
  }
  .hero-actions .btn{min-height:44px!important;font-size:.77rem!important;padding:9px 8px!important}
  .hero-merch{
    order:2!important;
    min-height:0!important;
    padding:7px 0 6px!important;
    gap:8px!important;
  }
  .product-feature{
    width:48%!important;
    max-width:none!important;
    border-radius:16px!important;
    box-shadow:0 16px 30px rgba(2,18,48,.22)!important;
  }
  .product-feature:first-child,.product-feature:last-child{transform:none!important}
  .hero-values{
    order:3!important;
    grid-template-columns:repeat(4,1fr)!important;
    gap:5px!important;
    margin:7px 0 12px!important;
  }
  .hero-value{
    flex-direction:column!important;
    text-align:center!important;
    gap:3px!important;
    font-size:.58rem!important;
  }
  .hero-value b{width:27px!important;height:27px!important;flex-basis:27px!important}
  .section{padding:17px 0!important}
  .section-head{margin-bottom:10px!important}
  .section h2{font-size:1.46rem!important}
  .sub{font-size:.75rem!important}
  .collection-grid{
    display:flex!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory!important;
    gap:9px!important;
    margin-right:-3vw!important;
    padding-right:3vw!important;
    padding-bottom:6px!important;
  }
  .collection-card{
    flex:0 0 43%!important;
    aspect-ratio:.9/1!important;
    scroll-snap-align:start!important;
  }
  .products{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .product-card{border-radius:14px!important}
  .product-info h3{font-size:.78rem!important}
  .product-info .btn{font-size:.7rem!important;min-height:40px!important}
}
@media(max-width:390px){
  .hero h1{font-size:2.55rem!important}
  .hero-actions{grid-template-columns:1fr!important}
  .collection-card{flex-basis:48%!important}
}

/* v13 — mobile proportion pass from live iPhone review */
@media(max-width:700px){
  .promo .container{padding:6px 0!important;font-size:.72rem!important}
  .site-header{box-shadow:0 5px 16px rgba(2,22,55,.12)!important}
  .nav{min-height:62px!important;padding:5px 0!important;gap:6px!important}
  .brand{gap:7px!important}
  .brand img{width:42px!important;height:42px!important;flex:0 0 42px!important}
  .brand-name{font-size:1.12rem!important}
  .brand-tag{font-size:.63rem!important}
  .round-btn{height:38px!important;min-width:38px!important;padding:0 8px!important;font-size:.76rem!important}
  .nav-actions{gap:5px!important}

  .hero-copy{padding:16px 0 4px!important}
  .eyebrow{font-size:.55rem!important;letter-spacing:.13em!important}
  .hero h1{
    font-size:clamp(2.42rem,9.9vw,3.15rem)!important;
    line-height:.9!important;
    max-width:90%!important;
    margin:4px 0 7px!important;
  }
  .hero-lead{
    font-size:.82rem!important;
    line-height:1.32!important;
    max-width:95%!important;
  }
  .hero-actions{
    margin-top:10px!important;
    grid-template-columns:1.12fr .88fr!important;
    gap:7px!important;
  }
  .hero-actions .btn{
    min-height:41px!important;
    padding:8px 8px!important;
    font-size:.73rem!important;
  }
  .hero-values{
    margin:7px 0 8px!important;
    gap:3px!important;
  }
  .hero-value{
    font-size:.52rem!important;
    line-height:1.05!important;
  }
  .hero-value b{
    width:24px!important;
    height:24px!important;
    flex-basis:24px!important;
    font-size:.72rem!important;
  }
  .hero-merch{
    padding:4px 0 4px!important;
    gap:7px!important;
  }
  .product-feature{
    width:46%!important;
    border-radius:14px!important;
    box-shadow:0 12px 24px rgba(2,18,48,.18)!important;
  }
  .product-feature img{aspect-ratio:1/1!important}
  .section{padding:14px 0!important}
  .section-head{margin-bottom:8px!important}
  .section h2{font-size:1.36rem!important}
  .sub{font-size:.71rem!important}
  .link{font-size:.74rem!important}
  .collection-card{flex-basis:40%!important;border-radius:14px!important}
}
@media(max-width:390px){
  .brand-name{font-size:1.04rem!important}
  .hero h1{font-size:2.32rem!important}
  .hero-actions{grid-template-columns:1fr!important}
  .collection-card{flex-basis:46%!important}
}