/* ADRIN V4 — Motion Commerce / mobile-first layer */
:root {
  --adrin-v4-black: #101010;
  --adrin-v4-ink: #171717;
  --adrin-v4-bone: #f5f1e9;
  --adrin-v4-paper: #fbf9f5;
  --adrin-v4-warm: #c79a61;
  --adrin-v4-muted: #77716a;
  --adrin-v4-line: rgba(16,16,16,.12);
  --adrin-v4-radius: 16px;
  --adrin-v4-shell: 1440px;
}

html { scroll-behavior: smooth; }
body { background: var(--adrin-v4-bone); }

.adrin-v4-shell {
  width: min(100%, var(--adrin-v4-shell));
  margin-inline: auto;
  padding-inline: clamp(1rem, 4vw, 4rem);
}

.adrin-v4-kicker {
  margin: 0 0 .65rem;
  color: rgba(255,255,255,.68);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .2em;
  text-transform: uppercase;
}
.adrin-v4-kicker--dark { color: #68625c; }

.adrin-v4-button {
  min-height: 52px;
  padding: .8rem 1.15rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .7rem;
  border-radius: 999px;
  font-family: var(--font-button-family);
  font-weight: 800;
  text-decoration: none;
  transition: transform .2s ease, background-color .2s ease, color .2s ease;
}
.adrin-v4-button--light { color: var(--adrin-v4-black); background: #fff; }
.adrin-v4-button:active { transform: scale(.98); }

/* Compact living header */
[ui-layout="navbar"] {
  transition: padding .22s ease, background-color .22s ease, box-shadow .22s ease, backdrop-filter .22s ease;
}
.adrin-v4-scrolled [ui-layout="navbar"] {
  background: rgba(248,245,239,.93);
  box-shadow: 0 10px 32px rgba(15,15,15,.07);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

/* Hero */
.adrin-v4-hero {
  position: relative;
  overflow: hidden;
  background: var(--adrin-v4-black);
  color: #fff;
}
.adrin-v4-hero__viewport {
  position: relative;
  aspect-ratio: 9 / 16;
  min-height: 590px;
  max-height: 820px;
}
.adrin-v4-hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .7s cubic-bezier(.2,.7,.2,1), visibility .7s step-end;
}
.adrin-v4-hero__slide.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity .7s cubic-bezier(.2,.7,.2,1), visibility 0s step-start;
}
.adrin-v4-hero__media,
.adrin-v4-hero__media picture,
.adrin-v4-hero__media img { width: 100%; height: 100%; display: block; }
.adrin-v4-hero__media img {
  object-fit: cover;
  object-position: var(--focal-x,50%) var(--focal-y,45%);
  transform: scale(1.015);
}
.adrin-v4-hero__slide.is-active .adrin-v4-hero__media img {
  animation: adrinV4HeroBreathe 8s ease-out both;
}
@keyframes adrinV4HeroBreathe { from { transform: scale(1.045); } to { transform: scale(1.005); } }
.adrin-v4-hero__shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.03) 0%, rgba(0,0,0,.08) 38%, rgba(0,0,0,.77) 100%),
    linear-gradient(90deg, rgba(0,0,0,.24), transparent 62%);
}
.adrin-v4-hero__content {
  position: absolute;
  z-index: 2;
  inset-inline: 0;
  bottom: 3.9rem;
  padding: 1.1rem 1.15rem;
}
.adrin-v4-hero__content h1 {
  max-width: 9ch;
  margin: 0;
  font-family: var(--font-heading-family);
  font-size: clamp(3.25rem, 16vw, 5.75rem);
  font-weight: 800;
  line-height: .86;
  letter-spacing: -.045em;
  text-transform: uppercase;
}
.adrin-v4-hero__description {
  max-width: 30rem;
  margin: .9rem 0 1.2rem;
  color: rgba(255,255,255,.83);
  font-size: .94rem;
  line-height: 1.55;
}
.adrin-v4-hero__content .adrin-v4-button { width: min(100%, 330px); }
.adrin-v4-hero__slide.is-active .adrin-v4-kicker,
.adrin-v4-hero__slide.is-active h1,
.adrin-v4-hero__slide.is-active .adrin-v4-hero__description,
.adrin-v4-hero__slide.is-active .adrin-v4-button {
  animation: adrinV4Rise .62s cubic-bezier(.2,.7,.2,1) both;
}
.adrin-v4-hero__slide.is-active h1 { animation-delay: .05s; }
.adrin-v4-hero__slide.is-active .adrin-v4-hero__description { animation-delay: .11s; }
.adrin-v4-hero__slide.is-active .adrin-v4-button { animation-delay: .17s; }
@keyframes adrinV4Rise { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:none; } }
.adrin-v4-hero__controls {
  position: absolute;
  z-index: 4;
  inset-inline: 1rem;
  bottom: 1rem;
  display: grid;
  grid-template-columns: 38px 1fr 38px;
  align-items: center;
  gap: .55rem;
}
.adrin-v4-hero__arrow {
  width: 38px;
  height: 38px;
  padding: 0;
  color: #fff;
  border: 1px solid rgba(255,255,255,.36);
  border-radius: 50%;
  background: rgba(10,10,10,.26);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.adrin-v4-hero__dots { display: flex; align-items: center; gap: .35rem; }
.adrin-v4-hero__dot {
  flex: 1;
  height: 20px;
  padding: 0;
  display: flex;
  align-items: center;
  border: 0;
  background: transparent;
}
.adrin-v4-hero__dot span { width:100%; height:2px; background:rgba(255,255,255,.28); overflow:hidden; }
.adrin-v4-hero__dot span::after {
  content:"";
  display:block;
  width:0;
  height:100%;
  background:#fff;
  transition: width .3s ease;
}
.adrin-v4-hero__dot.is-active span::after { width:100%; }
.adrin-v4-hero__swipe {
  position:absolute;
  z-index:3;
  top:1rem;
  right:1rem;
  padding:.45rem .65rem;
  color:rgba(255,255,255,.82);
  border:1px solid rgba(255,255,255,.25);
  border-radius:999px;
  background:rgba(0,0,0,.22);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  font-size:.6rem;
  font-weight:800;
  letter-spacing:.16em;
}
.adrin-v4-hero__trust {
  padding:.72rem 1rem;
  display:flex;
  align-items:center;
  gap:.72rem;
  overflow:auto;
  color:#e9e4dc;
  background:#0b0b0b;
  scrollbar-width:none;
  font-size:.66rem;
  font-weight:700;
  white-space:nowrap;
}
.adrin-v4-hero__trust::-webkit-scrollbar { display:none; }
.adrin-v4-hero__trust i { width:4px; height:4px; flex:0 0 auto; border-radius:50%; background:var(--adrin-v4-warm); }

/* Section headers */
.adrin-v4-section-head {
  margin-bottom:1.1rem;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:1rem;
}
.adrin-v4-section-head h2 {
  max-width: 16ch;
  margin:0;
  font-family:var(--font-heading-family);
  font-size:clamp(2rem, 10vw, 4.5rem);
  line-height:.96;
  letter-spacing:-.04em;
  text-transform:uppercase;
}
.adrin-v4-section-head > a { flex:0 0 auto; color:inherit; font-size:.75rem; font-weight:800; text-decoration:none; }
.adrin-v4-section-head--inverse { color:var(--lookbook-fg); }

/* Category swipe rail */
.adrin-v4-categories { padding:2.5rem 0 3rem; background:var(--adrin-v4-paper); }
.adrin-v4-categories__rail {
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(73%, 1fr);
  gap:.75rem;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scroll-snap-type:inline mandatory;
  scrollbar-width:none;
}
.adrin-v4-categories__rail::-webkit-scrollbar { display:none; }
.adrin-v4-category {
  position:relative;
  overflow:hidden;
  color:#fff;
  border-radius:var(--adrin-v4-radius);
  background:#181818;
  scroll-snap-align:start;
  text-decoration:none;
  box-shadow:0 14px 36px rgba(20,20,20,.09);
}
.adrin-v4-category__media { aspect-ratio:4/5; overflow:hidden; }
.adrin-v4-category__media::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 48%,rgba(0,0,0,.78) 100%);
}
.adrin-v4-category__media img { width:100%; height:100%; object-fit:cover; transition:transform .55s cubic-bezier(.2,.7,.2,1); }
.adrin-v4-category__copy {
  position:absolute;
  z-index:2;
  inset-inline:1rem;
  bottom:1rem;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:end;
  gap:.2rem 1rem;
}
.adrin-v4-category__copy strong { font-family:var(--font-heading-family); font-size:1.65rem; line-height:.9; letter-spacing:-.02em; text-transform:uppercase; }
.adrin-v4-category__copy span { grid-column:1; color:rgba(255,255,255,.72); font-size:.78rem; }
.adrin-v4-category__copy b { grid-row:1/3; grid-column:2; width:38px; height:38px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.45); border-radius:50%; font-weight:500; }
.adrin-v4-category:active .adrin-v4-category__media img { transform:scale(1.035); }

/* Lookbook / movement stories */
.adrin-v4-lookbook { padding:3rem 0 3.4rem; color:var(--lookbook-fg); background:var(--lookbook-bg); }
.adrin-v4-lookbook__rail {
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(82%,1fr);
  gap:.8rem;
  overflow-x:auto;
  scroll-snap-type:inline mandatory;
  overscroll-behavior-inline:contain;
  scrollbar-width:none;
}
.adrin-v4-lookbook__rail::-webkit-scrollbar { display:none; }
.adrin-v4-story {
  position:relative;
  overflow:hidden;
  border-radius:var(--adrin-v4-radius);
  scroll-snap-align:start;
  background:#222;
}
.adrin-v4-story__link { position:relative; display:block; color:inherit; text-decoration:none; }
.adrin-v4-story__media { aspect-ratio:4/5; overflow:hidden; }
.adrin-v4-story__media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 38%,rgba(0,0,0,.86) 100%); }
.adrin-v4-story__media img { width:100%; height:100%; object-fit:cover; transition:transform .65s cubic-bezier(.2,.7,.2,1); }
.adrin-v4-story__index {
  position:absolute;
  top:1rem;
  left:1rem;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.4);
  border-radius:50%;
  background:rgba(0,0,0,.18);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  font-size:.7rem;
  font-weight:800;
}
.adrin-v4-story__copy { position:absolute; z-index:2; inset-inline:1rem; bottom:1rem; }
.adrin-v4-story__copy small { color:var(--adrin-v4-warm); font-size:.63rem; font-weight:800; letter-spacing:.18em; }
.adrin-v4-story__copy h3 { margin:.25rem 0 .4rem; font-family:var(--font-heading-family); font-size:2rem; line-height:.94; text-transform:uppercase; }
.adrin-v4-story__copy p { margin:0 0 .8rem; color:rgba(255,255,255,.72); font-size:.82rem; line-height:1.5; }
.adrin-v4-story__cta { font-size:.72rem; font-weight:800; }

/* Make the existing collection grid feel like a living mobile shop */
[ui-section="featured-collection"] {
  padding-inline: 1rem;
  background:var(--adrin-v4-bone);
}
[ui-section="featured-collection"] [ui-slot="head"] { margin-bottom:1.1rem; }
[ui-section="featured-collection"] .subheading { color:#736d66; letter-spacing:.14em; }
[ui-section="featured-collection"] .heading {
  font-family:var(--font-heading-family);
  font-size:clamp(2.35rem, 11vw, 4.6rem);
  line-height:.92;
  letter-spacing:-.04em;
  text-transform:uppercase;
}
[ui-section="featured-collection"] [ui-block="products"] { gap:.65rem; }
[ui-section="featured-collection"] [ui-block="product"] { gap:.55rem; min-width:0; }
[ui-section="featured-collection"] [ui-block="product"] .media {
  background:#eee9e1;
  border-radius:14px;
  box-shadow: inset 0 0 0 1px rgba(18,18,18,.04);
}
[ui-section="featured-collection"] [ui-block="product"] .media[data-image-ratio="portrait"] { aspect-ratio:3/4; }
[ui-section="featured-collection"] [ui-block="product"] .content { gap:.18rem; }
[ui-section="featured-collection"] [ui-block="product"] .content .title { font-size:.78rem; font-weight:700; }
[ui-section="featured-collection"] [ui-block="product"] .content .price { font-size:.92rem; font-weight:800; }
[ui-section="featured-collection"] [ui-block="product"] .media > ui-shop-button:last-of-type,
[ui-section="featured-collection"] [ui-block="product"] .media > [ui-slot="button"]:last-of-type {
  inset-inline-end:.55rem;
  inset-block-end:.55rem;
}
.adrin-grid-empty { border-radius:14px; }

/* Existing origin becomes an editorial pause */
.adrin-origin { border-radius:0 !important; }
.adrin-origin__signal { color:var(--adrin-v4-warm) !important; }

/* Trust stays compact */
.adrin-v2-trust { background:var(--adrin-v4-paper); }
.adrin-v2-trust__item { min-width:0; }

/* Mobile sticky conversion rail */
.adrin-v2-sticky {
  z-index:70;
  border-top:1px solid rgba(255,255,255,.08);
  background:rgba(14,14,14,.94);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.adrin-v2-sticky__button { border-radius:999px; background:#fff; border-color:#fff; color:#111; }
body:has(.adrin-v2-sticky) .adrin-whatsapp { bottom:94px; }

/* Product page: faster reading, stronger buy action on mobile */
@media (max-width:768px) {
  [ui-section="single-product"] { padding-inline:1rem !important; }
  [ui-section="single-product"] .product-details,
  [ui-section="single-product"] [ui-block="product-info"] { gap:.8rem; }
  [ui-section="single-product"] [ui-slot="heading"],
  [ui-section="single-product"] .heading { letter-spacing:-.035em; }
  [ui-section="single-product"] [ui-slot="button"][data-size="lg"] { min-height:54px; border-radius:999px; }
  [ui-section="single-product"] .media img { border-radius:14px; }
}

/* Reveal layer */
html.adrin-v4-motion [data-adrin-reveal] {
  opacity:0;
  transform:translateY(18px);
  transition:opacity .62s cubic-bezier(.2,.7,.2,1), transform .62s cubic-bezier(.2,.7,.2,1);
}
html.adrin-v4-motion [data-adrin-reveal].is-visible { opacity:1; transform:none; }

/* Desktop adapts without changing mobile art direction */
@media (min-width:769px) {
  .adrin-v4-hero__viewport { aspect-ratio:16/9; min-height:620px; max-height:min(82vh,900px); }
  .adrin-v4-hero__content { width:min(100%,var(--adrin-v4-shell)); margin-inline:auto; padding:3rem clamp(2rem,5vw,5rem); bottom:3.8rem; }
  .adrin-v4-hero__content h1 { font-size:clamp(4.5rem,8vw,8.25rem); }
  .adrin-v4-hero__content .adrin-v4-button { width:auto; }
  .adrin-v4-hero__controls { inset-inline:auto 3rem; left:auto; width:min(420px,32vw); }
  .adrin-v4-hero__swipe { display:none; }
  .adrin-v4-hero__trust { justify-content:center; }

  .adrin-v4-categories { padding:4.5rem 0 5rem; }
  .adrin-v4-categories__rail { grid-auto-flow:initial; grid-auto-columns:initial; grid-template-columns:repeat(4,minmax(0,1fr)); overflow:visible; }
  .adrin-v4-category:hover .adrin-v4-category__media img { transform:scale(1.045); }

  .adrin-v4-lookbook { padding:5rem 0; }
  .adrin-v4-lookbook__rail { grid-auto-flow:initial; grid-auto-columns:initial; grid-template-columns:repeat(3,minmax(0,1fr)); overflow:visible; }
  .adrin-v4-story:hover .adrin-v4-story__media img { transform:scale(1.045); }

  [ui-section="featured-collection"] { padding-inline:clamp(2rem,4vw,4rem); }
  [ui-section="featured-collection"] [ui-block="products"] { gap:1.15rem; }
}

@media (max-width:768px) {
  #youcan-section--navbar [ui-layout="navbar"] { padding:.65rem 1rem; min-height:58px; }
  .adrin-v4-scrolled #youcan-section--navbar [ui-layout="navbar"] { padding-block:.45rem; }
  #youcan-section--announcement-bar { font-size:.72rem; }

  .adrin-v4-section-head { align-items:center; }
  .adrin-v4-section-head h2 { font-size:clamp(2rem,10vw,3.5rem); }
  .adrin-v4-section-head > a { font-size:.68rem; }

  [ui-section="featured-collection"] { --top-spacing:36px !important; --bottom-spacing:44px !important; }
  [ui-section="featured-collection"] [ui-block="products"] { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  [ui-section="featured-collection"] [ui-block="product"] .badge { margin:.45rem; }

  .adrin-v2-trust__item { padding:.75rem 0; }
}

@media (max-width:390px) {
  .adrin-v4-hero__viewport { min-height:520px; }
  .adrin-v4-hero__content h1 { font-size:3.15rem; }
  .adrin-v4-categories__rail { grid-auto-columns:79%; }
  .adrin-v4-lookbook__rail { grid-auto-columns:88%; }
  [ui-section="featured-collection"] { padding-inline:.8rem; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .adrin-v4-hero__slide,
  .adrin-v4-hero__media img,
  .adrin-v4-category__media img,
  .adrin-v4-story__media img,
  [data-adrin-reveal] { animation:none !important; transition:none !important; }
  html.adrin-v4-motion [data-adrin-reveal] { opacity:1; transform:none; }
}

/* Product imagery contract: ADRIN product photos are 3:4 (recommended 1200 × 1600 px). */
[ui-section="single-product"] .core .media[data-layout="carousel"] [ui-slot="carousel"].main-media {
  aspect-ratio: 3 / 4;
  background: #eee9e1;
}
[ui-section="single-product"] .core .media[data-layout="grid"] .image {
  aspect-ratio: 3 / 4;
  background: #eee9e1;
}
[ui-section="single-product"] .core .media img { object-fit: cover; }

@media (max-width:768px) {
  [ui-section="single-product"] .core .media[data-layout="carousel"] { gap:.6rem; }
  [ui-section="single-product"] .core .media[data-layout="carousel"] [ui-slot="carousel"].main-media { border-radius:16px; }
  [ui-section="single-product"] .core .media[data-layout="carousel"] [ui-slot="carousel"].markers { --per-page: 5; --gap: .45rem; }
  [ui-section="single-product"] .core .content { padding-top:.35rem; }
}