.atom-avatar{display:inline-flex;align-items:center;justify-content:center;position:relative;width:3rem;height:3rem;border-radius:var(--border-radius-full);overflow:hidden;background:var(--bg-surface-low);box-shadow:var(--shadow-sm)}
.atom-avatar:focus{outline:2px solid var(--brand-primary);outline-offset:2px;border-radius:var(--border-radius-full)}
.atom-avatar__img{position:absolute;inset:0;background-size:cover;background-position:center;border-radius:inherit}
.atom-avatar__label{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.atom-avatar__fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:var(--bg-brand);color:var(--fg-on-brand);font-family:var(--font-body-md-family);font-weight:600}
.atom-avatar__initials{font-size:1rem;line-height:1;letter-spacing:0.02em}
.atom-avatar__fallback{transition:transform .18s cubic-bezier(.2,.9,.25,1),box-shadow .18s cubic-bezier(.2,.9,.25,1)}
.atom-avatar:hover .atom-avatar__fallback{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.atom-avatar:active .atom-avatar__fallback{transform:scale(.98);box-shadow:var(--shadow-sm)}
@media (prefers-reduced-motion:reduce){.atom-avatar__fallback{transition:none}.atom-avatar:hover .atom-avatar__fallback{transform:none}}

.atom-badge{display:inline-block;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--border-radius-sm);font-family:var(--font-label-sm-family);font-size:var(--font-label-sm-size);font-weight:var(--font-label-sm-weight);line-height:var(--font-label-sm-line-height);letter-spacing:var(--font-label-sm-letter-spacing);background:var(--brand-accent);color:var(--fg-on-accent);box-shadow:var(--shadow-sm);transition:transform .18s cubic-bezier(.2,.9,.25,1),box-shadow .18s cubic-bezier(.2,.9,.25,1);position:relative;vertical-align:middle}.atom-badge::after{content:"";position:absolute;right:-6px;top:50%;transform:translateY(-50%) rotate(15deg);width:8px;height:8px;background:transparent;border-top:2px solid rgba(255,255,255,0.08);border-right:2px solid rgba(255,255,255,0.08);border-radius:2px;opacity:.9}.atom-badge:focus{outline:2px solid var(--brand-primary);outline-offset:3px}.atom-badge[data-variant="muted"]{background:var(--bg-surface-low);color:var(--fg-secondary);border:1px solid var(--border-color-subtle)}.atom-badge[data-variant="muted"]::after{display:none}@media (prefers-reduced-motion: no-preference){.atom-badge:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}.atom-badge:active{transform:scale(.98);box-shadow:var(--shadow-sm)}}

.btn-primary{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 var(--spacing-xs);padding-left:1rem;padding-right:1rem;border-radius:var(--border-radius-md);background:var(--brand-primary);color:var(--fg-on-brand);font-family:var(--font-label-md-family);font-size:var(--font-label-md-size);font-weight:var(--font-label-md-weight);line-height:var(--font-label-md-line-height);letter-spacing:var(--font-label-md-letter-spacing);text-decoration:none;cursor:pointer;transition:transform .18s cubic-bezier(.2,.9,.25,1),box-shadow .18s cubic-bezier(.2,.9,.25,1),background-color .18s cubic-bezier(.2,.9,.25,1);box-shadow:var(--shadow-sm);position:relative;overflow:visible;padding-left:16px;padding-right:16px;height:44px;border:1px solid transparent;}

.btn-secondary{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 16px;border-radius:var(--border-radius-md);background:var(--bg-surface-low);color:var(--fg-on-default);font-family:var(--font-label-md-family);font-size:var(--font-label-md-size);font-weight:var(--font-label-md-weight);line-height:var(--font-label-md-line-height);letter-spacing:var(--font-label-md-letter-spacing);text-decoration:none;cursor:pointer;transition:transform .18s cubic-bezier(.2,.9,.25,1),box-shadow .18s cubic-bezier(.2,.9,.25,1),background-color .18s cubic-bezier(.2,.9,.25,1);box-shadow:var(--shadow-sm);border:1px solid var(--border-color-subtle);position:relative;}

.btn-tertiary{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 12px;border-radius:var(--border-radius-md);background:transparent;color:var(--brand-primary);font-family:var(--font-label-md-family);font-size:var(--font-label-md-size);font-weight:var(--font-label-md-weight);line-height:var(--font-label-md-line-height);letter-spacing:var(--font-label-md-letter-spacing);text-decoration:none;cursor:pointer;transition:background-color .18s cubic-bezier(.2,.9,.25,1),color .18s cubic-bezier(.2,.9,.25,1),transform .18s cubic-bezier(.2,.9,.25,1);position:relative;padding-left:12px;padding-right:12px;border:1px solid transparent;}

.atom-chip{display:inline-flex;align-items:center;gap:8px;padding:4px 10px;border-radius:var(--border-radius-lg);font-family:var(--font-label-sm-family);font-size:var(--font-label-sm-size);font-weight:var(--font-label-sm-weight);line-height:var(--font-label-sm-line-height);letter-spacing:var(--font-label-sm-letter-spacing);background:var(--bg-subtle);color:var(--fg-secondary);cursor:pointer;border:1px solid var(--border-color-subtle);transition:transform .18s cubic-bezier(.2,.9,.25,1),box-shadow .18s cubic-bezier(.2,.9,.25,1),background .12s ease;box-shadow:var(--shadow-sm);padding-top:4px;padding-bottom:4px}.atom-chip:focus{outline:2px solid var(--brand-primary);outline-offset:3px}.atom-chip .bi{font-size:0.9em;opacity:.9}.atom-chip[data-state="active"]{background:var(--bg-brand);color:var(--fg-on-brand);border-color:transparent;box-shadow:var(--shadow-md);transform:translateY(-4px)}.atom-chip[data-disabled="true"]{background:var(--bg-surface-low);color:var(--fg-disabled);cursor:not-allowed;box-shadow:none;transform:none}@media (prefers-reduced-motion: no-preference){.atom-chip:active{transform:scale(.98);box-shadow:var(--shadow-sm)}}

.atom-image-frame-animated { display: inline-block; max-width: 100%; border-radius: var(--border-radius-md); overflow: hidden; background: linear-gradient(180deg, var(--bg-surface-low), var(--bg-surface-high)); padding: 0; position: relative; }
.atom-image-frame-animated__img { display: block; width: 100%; height: auto; transform-origin: center; transition: transform .18s cubic-bezier(.2,.9,.25,1), filter .18s cubic-bezier(.2,.9,.25,1), box-shadow .18s cubic-bezier(.2,.9,.25,1); will-change: transform, filter; border-radius: calc(var(--border-radius-md) - 2px); }
.atom-image-frame-animated::before { content: ""; position: absolute; left: 12px; top: 12px; width: 8px; height: 8px; background: var(--bg-brand); border-radius: 2px; opacity: .08; }
.atom-image-frame-animated:hover .atom-image-frame-animated__img { transform: translateY(-6px) scale(1.01); box-shadow: var(--shadow-md); filter: saturate(1.03); }
.atom-image-frame-animated:focus-within .atom-image-frame-animated__img { outline: 3px solid var(--brand-secondary); outline-offset: 4px; }
@media (prefers-reduced-motion: no-preference) {
  .atom-image-frame-animated__img { transition: transform .5s cubic-bezier(.2,.9,.25,1), filter .5s cubic-bezier(.2,.9,.25,1); }
  .atom-image-frame-animated__img { transform: translateY(0) translateZ(0); }
  .atom-image-frame-animated.is-inview .atom-image-frame-animated__img { transform: translateY(-8px) scale(1.01); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) { .atom-image-frame-animated__img { transition: none !important; } }

.atom-image-frame-raw { display: inline-block; max-width: 100%; border-radius: var(--border-radius-md); background: var(--bg-surface-high); padding: var(--spacing-xs); box-shadow: var(--shadow-sm); border: 1px solid var(--border-color-subtle); overflow: hidden; position: relative; }
.atom-image-frame-raw__img { display: block; width: 100%; height: auto; border-radius: calc(var(--border-radius-md) - 2px); transition: transform .15s cubic-bezier(.2,.9,.25,1), box-shadow .15s cubic-bezier(.2,.9,.25,1); }
.atom-image-frame-raw::after { content: ""; position: absolute; right: 8px; top: 8px; width: 36px; height: 12px; background: var(--bg-brand); border-radius: 4px 4px 0 4px; transform: rotate(8deg); opacity: .08; pointer-events: none; }
.atom-image-frame-raw:focus-within, .atom-image-frame-raw:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.atom-image-frame-raw:focus-within { outline: 3px solid var(--brand-secondary); outline-offset: 4px; }

.atom-image-frame-zoom { display: inline-block; max-width: 100%; border-radius: var(--border-radius-md); background: var(--bg-surface-high); padding: var(--spacing-xs); border: 1px solid var(--border-color-subtle); overflow: visible; }
.atom-image-frame-zoom__btn { display: block; width: 100%; border-radius: calc(var(--border-radius-md) - 2px); overflow: hidden; position: relative; transition: transform .15s cubic-bezier(.2,.9,.25,1), box-shadow .15s cubic-bezier(.2,.9,.25,1); }
.atom-image-frame-zoom__img { display: block; width: 100%; height: auto; transition: transform .18s cubic-bezier(.2,.9,.25,1); }
.atom-image-frame-zoom__btn:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.atom-image-frame-zoom__btn:active { transform: scale(.98); box-shadow: var(--shadow-sm); }
.atom-image-frame-zoom__btn:focus { outline: 3px solid var(--brand-primary); outline-offset: 4px; }
.atom-image-frame-zoom__btn::after { content: ""; position: absolute; left: 8px; bottom: 8px; width: 36px; height: 10px; background: var(--bg-accent); border-radius: 6px 6px 6px 2px; opacity: .06; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .atom-image-frame-zoom__btn, .atom-image-frame-zoom__img { transition: none !important; } }
.atom-image-frame-zoom--overlay { --overlay-bg: rgba(11,11,11,0.8); }
.atom-image-frame-zoom__overlay { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; background: var(--overlay-bg); z-index: 9999; }
.atom-image-frame-zoom__overlay .atom-image-frame-zoom__panel { max-width: 95vw; max-height: 95vh; padding: var(--spacing-sm); border-radius: var(--border-radius-lg); box-shadow: var(--shadow-lg); background: rgba(255,255,255,0.02); display: flex; align-items: center; justify-content: center; }
.atom-image-frame-zoom__overlay img { max-width: 100%; max-height: 85vh; border-radius: var(--border-radius-md); box-shadow: var(--shadow-md); }
.atom-image-frame-zoom__close { position: fixed; right: calc(var(--spacing-md)); top: calc(var(--spacing-md)); background: var(--bg-inverse); color: var(--fg-on-inverse); border-radius: var(--border-radius-full); width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; box-shadow: var(--shadow-md); }
.atom-image-frame-zoom__close:focus { outline: 3px solid var(--brand-primary); outline-offset: 4px; }

.atom-phone-reveal { display: inline-flex; align-items: center; gap: var(--spacing-sm); padding: calc(var(--spacing-sm) / 2) var(--spacing-md); background: var(--bg-surface-high); color: var(--fg-on-default); border: 1px solid var(--border-color-default); border-radius: var(--border-radius-md); box-shadow: var(--shadow-sm); transition: transform .15s cubic-bezier(.2,.9,.25,1), box-shadow .15s cubic-bezier(.2,.9,.25,1), border-color .15s cubic-bezier(.2,.9,.25,1); font-family: var(--font-body-md-family); font-size: var(--font-body-md-size); line-height: var(--font-body-md-line-height); cursor: pointer; }
.atom-phone-reveal:focus { outline: 2px solid var(--brand-primary); outline-offset: 2px; }
.atom-phone-reveal:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: var(--brand-secondary); }
.atom-phone-reveal:active { transform: scale(.98); box-shadow: var(--shadow-sm); }
.atom-phone-reveal__label { display: inline-block; font-weight: 600; color: var(--fg-on-default); }
.atom-phone-reveal__content { display: inline-block; max-width: 0; overflow: hidden; white-space: nowrap; transition: max-width .18s cubic-bezier(.2,.9,.25,1), opacity .15s ease; opacity: 0; }
.atom-phone-reveal__tel { display: inline-block; color: var(--bg-brand); background: var(--bg-surface-low); padding: 0 calc(var(--spacing-xs)); border-radius: var(--border-radius-sm); font-weight: 600; }
.atom-phone-reveal__icon { display: inline-flex; width: 1em; height: 1em; color: var(--brand-accent); opacity: 1; transition: transform .15s cubic-bezier(.2,.9,.25,1), color .15s ease; }
.atom-phone-reveal.is-revealed { border-color: var(--brand-primary); box-shadow: var(--shadow-md); }
.atom-phone-reveal.is-revealed .atom-phone-reveal__content { max-width: 18ch; opacity: 1; margin-left: calc(var(--spacing-xs) / 2); }
.atom-phone-reveal.is-revealed .atom-phone-reveal__label { transform: translateX(-6px); opacity: .8; }
.atom-phone-reveal.is-revealed .atom-phone-reveal__icon { transform: rotate(-12deg); color: var(--brand-primary); }
.atom-phone-reveal[aria-disabled="true"] { cursor: default; color: var(--fg-disabled); border-color: var(--border-color-subtle); box-shadow: none; }
@media (prefers-reduced-motion: reduce) { .atom-phone-reveal, .atom-phone-reveal__content, .atom-phone-reveal__icon { transition: none !important; } }

.atom-pill{display:inline-block;padding:calc(var(--spacing-sm) + 2px) var(--spacing-md);border-radius:var(--border-radius-full);font-family:var(--font-label-sm-family);font-size:var(--font-label-sm-size);font-weight:var(--font-label-sm-weight);line-height:var(--font-label-sm-line-height);letter-spacing:var(--font-label-sm-letter-spacing);background:var(--bg-surface-low);color:var(--fg-secondary);box-shadow:0 2px 6px rgba(11,11,11,0.06);transition:transform .18s cubic-bezier(.2,.9,.25,1),box-shadow .18s cubic-bezier(.2,.9,.25,1);vertical-align:middle;position:relative;padding-top:6px;padding-bottom:6px}.atom-pill::before{content:"";position:absolute;left:6px;top:50%;transform:translateY(-50%);width:6px;height:6px;background:var(--bg-accent);border-radius:4px;box-shadow:0 1px 0 rgba(255,255,255,0.02)}@media (prefers-reduced-motion: no-preference){.atom-pill:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}.atom-pill:active{transform:scale(.98);box-shadow:0 1px 2px rgba(11,11,11,0.06)}}

.atom-quote { 
  --root-bg: var(--bg-surface-high);
  --root-border: var(--border-color-subtle);
  --root-accent: var(--brand-primary);
  --root-accent-weak: var(--bg-subtle);
  padding: var(--spacing-sm) var(--spacing-md);
  background: var(--root-bg);
  border-radius: var(--border-radius-md);
  border-left: 6px solid var(--root-accent);
  box-shadow: var(--shadow-sm);
  max-width: 56rem;
  margin: 0 0 var(--spacing-md);
  transition: transform 0.18s cubic-bezier(.2,.9,.25,1), box-shadow 0.18s cubic-bezier(.2,.9,.25,1);
}
.atom-quote:hover { 
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.atom-quote:active {
  transform: scale(.98);
  box-shadow: var(--shadow-sm);
}
.atom-quote__text {
  margin: 0 0 0.5rem 0;
  color: var(--fg-on-default);
  font-family: var(--font-body-md-family);
  font-size: var(--font-body-md-size);
  line-height: var(--font-body-md-line-height);
}
.atom-quote__footer {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}
.atom-quote__cite {
  color: var(--fg-secondary);
  font-family: var(--font-label-md-family);
  font-size: var(--font-label-md-size);
  font-weight: var(--font-label-md-weight);
  background: linear-gradient(90deg, var(--root-accent-weak) 0%, var(--root-accent-weak) 100%);
  padding: 0.125rem 0.5rem;
  border-radius: calc(var(--border-radius-sm) + 2px);
  box-shadow: 0 1px 0 rgba(11,11,11,0.02) inset;
}
.atom-quote__cite::before {
  content: "\2014\00A0";
  color: var(--root-accent);
  font-weight: 600;
}
.atom-quote:focus-within {
  outline: 2px solid var(--brand-primary);
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  .atom-quote, .atom-quote:hover, .atom-quote:active { transition: none; transform: none; }
}

.atom-reading-progress { --progress: 0; --progress-percent: calc(var(--progress) * 1%); }
.atom-reading-progress[data-variant="overlay-top"] { position: fixed; inset-inline: 0; top: 0; z-index: 1200; pointer-events: none; display: block; }
.atom-reading-progress[data-variant="overlay-top"] .atom-reading-progress__bar { height: 6px; background: linear-gradient(90deg, var(--bg-surface-high) 0%, var(--bg-surface-high) 100%); width: 100%; position: relative; overflow: hidden; box-shadow: var(--shadow-sm); border-bottom-left-radius: var(--border-radius-sm); border-bottom-right-radius: var(--border-radius-sm); }
.atom-reading-progress[data-variant="overlay-top"] .atom-reading-progress__bar::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: calc(var(--progress) * 1%); background: linear-gradient(90deg, var(--bg-brand), var(--bg-accent)); transition: width .18s cubic-bezier(.2,.9,.25,1); display: block; }
.atom-reading-progress[data-variant="inline-content"] { position: relative; width: 100%; display: block; margin: var(--spacing-sm) 0; }
.atom-reading-progress[data-variant="inline-content"] .atom-reading-progress__container { display: flex; align-items: center; gap: var(--spacing-sm); }
.atom-reading-progress[data-variant="inline-content"] .atom-reading-progress__marker { width: 36px; height: 36px; display: inline-grid; place-items: center; background: var(--bg-surface-high); border-radius: var(--border-radius-md); box-shadow: var(--shadow-sm); color: var(--fg-on-default); flex: 0 0 36px; transform-origin: center; transition: transform .18s cubic-bezier(.2,.9,.25,1); }
.atom-reading-progress[data-variant="inline-content"] .atom-reading-progress__marker i { font-size: 0.9rem; color: var(--brand-primary); }
.atom-reading-progress[data-variant="inline-content"] .atom-reading-progress__marker:focus-within,
.atom-reading-progress[data-variant="inline-content"] .atom-reading-progress__marker:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.atom-reading-progress[data-variant="inline-content"] .atom-reading-progress__track { flex: 1; height: 10px; background: var(--bg-surface-low); border-radius: var(--border-radius-full); overflow: hidden; position: relative; }
.atom-reading-progress[data-variant="inline-content"] .atom-reading-progress__fill { position: absolute; left: 0; top: 0; bottom: 0; width: calc(var(--progress) * 1%); background: linear-gradient(90deg, var(--brand-primary), var(--brand-accent)); transition: width .18s cubic-bezier(.2,.9,.25,1); }
.atom-reading-progress[data-variant="sidebar"] { display: inline-flex; align-items: center; gap: var(--spacing-sm); }
.atom-reading-progress[data-variant="sidebar"] .atom-reading-progress__card { width: 120px; padding: var(--spacing-sm); background: var(--bg-surface-high); border-radius: var(--border-radius-lg); box-shadow: var(--shadow-md); display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--spacing-xs); }
.atom-reading-progress[data-variant="sidebar"] .atom-reading-progress__label { font-family: var(--font-label-md-family); font-size: var(--font-label-md-size); color: var(--fg-secondary); }
.atom-reading-progress[data-variant="sidebar"] .atom-reading-progress__value { font-family: var(--font-title-md-family); font-size: var(--font-title-md-size); font-weight: 700; color: var(--fg-on-default); }
.atom-reading-progress[data-variant="sidebar"] .atom-reading-progress__ring { width: 48px; height: 48px; transform: rotate(-90deg); }
.atom-reading-progress[data-variant="sidebar"] .atom-reading-progress__ring-bg { fill: none; stroke: var(--bg-subtle); stroke-width: 4; }
.atom-reading-progress[data-variant="sidebar"] .atom-reading-progress__ring-fg { fill: none; stroke: var(--brand-primary); stroke-width: 4; stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--progress)); transition: stroke-dashoffset .18s cubic-bezier(.2,.9,.25,1); }
.atom-reading-progress [role="progressbar"] { outline: none; }
.atom-reading-progress [role="progressbar"]:focus { box-shadow: 0 0 0 4px rgba(108,31,43,0.12); border-radius: var(--border-radius-sm); }
@media (prefers-reduced-motion: reduce) {
  .atom-reading-progress .atom-reading-progress__bar::before,
  .atom-reading-progress .atom-reading-progress__fill,
  .atom-reading-progress .atom-reading-progress__ring-fg { transition: none; }
}
:root[data-theme="dark"] .atom-reading-progress[data-variant="overlay-top"] .atom-reading-progress__bar { background: var(--bg-inverse); }
:root[data-theme="dark"] .atom-reading-progress[data-variant="overlay-top"] .atom-reading-progress__bar::before { background: linear-gradient(90deg, var(--brand-secondary), var(--brand-accent)); }
:root[data-theme="dark"] .atom-reading-progress[data-variant="inline-content"] .atom-reading-progress__track { background: var(--bg-inverse); }
:root[data-theme="dark"] .atom-reading-progress[data-variant="inline-content"] .atom-reading-progress__fill { background: linear-gradient(90deg, var(--brand-secondary), var(--brand-accent)); }
:root[data-theme="dark"] .atom-reading-progress[data-variant="sidebar"] .atom-reading-progress__card { background: var(--bg-inverse); color: var(--fg-on-inverse); }
:root[data-theme="dark"] .atom-reading-progress[data-variant="sidebar"] .atom-reading-progress__ring-fg { stroke: var(--bg-accent); }

.scroll-top{position:fixed;right:var(--spacing-md);bottom:var(--spacing-lg);display:inline-grid;place-items:center;width:44px;height:44px;border-radius:var(--border-radius-full);background:var(--bg-surface-high);color:var(--fg-on-default);box-shadow:var(--shadow-sm);opacity:0;pointer-events:none;transform:translateY(8px);transition:opacity .18s cubic-bezier(.2,.9,.25,1),transform .18s cubic-bezier(.2,.9,.25,1),box-shadow .18s cubic-bezier(.2,.9,.25,1);border:1px solid var(--border-color-subtle);z-index:60}
.scroll-top:focus{outline:2px solid var(--brand-primary);outline-offset:3px;box-shadow:var(--shadow-md);transform:translateY(-2px)}
.scroll-top:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.scroll-top.is-visible{opacity:1;pointer-events:auto;transform:translateY(0)}
@media(min-width:900px){.scroll-top{right:calc(var(--spacing-md) * 1.5);bottom:var(--spacing-xl);width:52px;height:52px}}

.atom-search { display: inline-flex; align-items: center; gap: var(--spacing-sm); height: 48px; background: var(--bg-surface-low); border-radius: var(--border-radius-lg); padding: 0 6px; box-shadow: var(--shadow-sm); border: 1px solid var(--border-color-subtle); transition: transform .15s cubic-bezier(.2,.9,.25,1), box-shadow .15s cubic-bezier(.2,.9,.25,1); }
.atom-search:focus-within { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.atom-search__label { display: flex; align-items: center; flex: 1 1 auto; width: 100%; }
.atom-search__visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.atom-search__input { flex: 1 1 auto; height: 48px; padding: 10px 14px; border-radius: calc(var(--border-radius-lg) - 2px); border: none; background: transparent; color: var(--fg-on-default); font-family: var(--font-body-md-family); font-size: var(--font-body-md-size); line-height: var(--font-body-md-line-height); outline: none; }
.atom-search__input::placeholder { color: var(--fg-on-subtle); }
.atom-search__submit { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--border-radius-md); background: var(--bg-brand); color: var(--fg-on-brand); transition: transform .12s cubic-bezier(.2,.9,.25,1), background .12s cubic-bezier(.2,.9,.25,1), box-shadow .12s cubic-bezier(.2,.9,.25,1); box-shadow: none; }
.atom-search__submit:hover { background: var(--brand-primary-hover); transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.atom-search__submit:active { transform: scale(.98); box-shadow: none; }
.atom-search__submit:focus { outline: 2px solid var(--brand-primary); outline-offset: 2px; }
.atom-search__submit i { font-size: 1.05rem; line-height: 1; }
@media (prefers-reduced-motion: reduce) { .atom-search, .atom-search__submit { transition: none; transform: none; } }
[data-theme="dark"] .atom-search { background: var(--bg-inverse); border-color: var(--border-color-strong); }
[data-theme="dark"] .atom-search__input { color: var(--fg-on-inverse); }
[data-theme="dark"] .atom-search__input::placeholder { color: var(--fg-on-default); }
[data-theme="dark"] .atom-search__submit { background: var(--brand-secondary); color: var(--fg-on-brand); }
[data-theme="dark"] .atom-search__submit:hover { background: var(--brand-secondary-hover); }

.card-article { background: var(--bg-surface-high); color: var(--fg-on-default); padding: 16px; border-radius: var(--border-radius-lg); box-shadow: var(--shadow-md); transition: transform .18s cubic-bezier(.2,.9,.25,1), box-shadow .18s cubic-bezier(.2,.9,.25,1); display: block; overflow: hidden; }
.card-article__link { display: block; color: inherit; text-decoration: none; }
.card-article__media { margin: 0 0 var(--spacing-sm) 0; border-radius: calc(var(--border-radius-lg) - 2px); overflow: hidden; display: block; }
.card-article__img { width: 100%; height: 160px; object-fit: cover; display: block; }
.card-article__fallback { margin: 0 0 var(--spacing-sm) 0; border-radius: calc(var(--border-radius-lg) - 2px); overflow: hidden; display: grid; place-items: center; height: 160px; background: linear-gradient(180deg, var(--bg-brand) 0%, var(--bg-accent) 100%); }
.card-article__fallback-initial { font-family: var(--font-display-md-family); font-size: var(--font-display-md-size); color: var(--fg-on-brand); }
.card-article__body { padding: 0; }
.card-article__title { margin: 0 0 .5rem 0; font-family: var(--font-headline-sm-family); font-size: var(--font-headline-sm-size); font-weight: var(--font-headline-sm-weight); color: var(--fg-on-default); }
.card-article__excerpt { margin: 0; color: var(--fg-secondary); font-size: var(--font-body-sm-size); }
.card-article:focus-within { outline: 2px solid var(--brand-primary); outline-offset: 2px; }
.card-article:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.card-article:active { transform: scale(.98); box-shadow: var(--shadow-md); }
.card-article__img, .card-article__fallback { transition: transform .18s cubic-bezier(.2,.9,.25,1); }
.card-article:hover .card-article__img, .card-article:hover .card-article__fallback { transform: translateY(-2px); }
@media (prefers-reduced-motion: reduce) { .card-article, .card-article__img, .card-article__fallback { transition: none; transform: none; } }

.card-category { display: flex; align-items: center; gap: .75rem; padding: 14px; background: var(--bg-subtle); color: var(--fg-on-default); border-radius: var(--border-radius-lg); transition: transform .15s cubic-bezier(.2,.9,.25,1), box-shadow .15s cubic-bezier(.2,.9,.25,1); text-decoration: none; }
.card-category__media { width: 64px; height: 64px; flex: 0 0 64px; border-radius: calc(var(--border-radius-lg) - 4px); overflow: hidden; background: var(--bg-surface-low); display: grid; place-items: center; }
.card-category__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.card-category__body { display: flex; flex-direction: column; gap: .25rem; }
.card-category__title { font-weight: 600; color: var(--fg-on-default); }
.card-category__count { font-size: var(--font-body-sm-size); color: var(--fg-secondary); background: transparent; padding: .125rem .5rem; border-radius: var(--border-radius-sm); }
.card-category:focus { outline: 2px solid var(--brand-primary); outline-offset: 2px; }
.card-category:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.card-category:active { transform: scale(.98); box-shadow: none; }
@media (prefers-reduced-motion: reduce) { .card-category { transition: none; transform: none; } }

.card-product { background: var(--bg-surface-high); color: var(--fg-on-default); padding: 12px; border-radius: var(--border-radius-md); box-shadow: var(--shadow-md); transition: transform .18s cubic-bezier(.2,.9,.25,1), box-shadow .18s cubic-bezier(.2,.9,.25,1); position: relative; overflow: visible; }
.card-product__link { display: block; color: inherit; text-decoration: none; border-radius: inherit; }
.card-product__media { width: 100%; aspect-ratio: 1/1; overflow: hidden; border-radius: calc(var(--border-radius-md) - 2px); background: var(--bg-surface-high); display: grid; place-items: center; padding: 0.5rem; }
.card-product__img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; display: block; margin: auto; }
.card-product__media--empty { background: linear-gradient(180deg, var(--bg-subtle), var(--bg-surface-low)); }
.card-product__empty-initial { font-family: var(--font-display-md-family); font-size: var(--font-display-md-size); color: var(--brand-primary); }
.card-product__body { padding-top: .75rem; display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.card-product__title { margin: 0; font-family: var(--font-title-md-family); font-size: var(--font-title-md-size); font-weight: var(--font-title-md-weight); color: var(--fg-on-default); }
.card-product__meta { display: flex; align-items: center; gap: .5rem; }
.card-product__price { font-weight: 700; color: var(--brand-primary); }
.card-product__notch { position: absolute; top: 12px; left: 12px; width: 34px; height: 12px; background: var(--bg-brand); border-radius: 0 0 var(--border-radius-sm) 0; transform: skewX(-12deg); box-shadow: 0 2px 6px rgba(11,11,11,0.06); }
.card-product:focus-within { outline: 2px solid var(--brand-primary); outline-offset: 2px; }
.card-product:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.card-product:active { transform: scale(.98); box-shadow: var(--shadow-md); }
@media (prefers-reduced-motion: reduce) { .card-product { transition: none; transform: none; } }

.faq-item { width: 100%; border-radius: var(--border-radius-md); background: var(--bg-surface-high); border: 1px solid var(--border-color-subtle); box-shadow: var(--shadow-sm); overflow: clip; transition: box-shadow .18s cubic-bezier(.2,.9,.25,1), transform .18s cubic-bezier(.2,.9,.25,1); }
.faq-item__summary { display: flex; align-items: center; gap: var(--spacing-sm); padding: calc(var(--spacing-sm) + 2px) var(--spacing-md); cursor: pointer; list-style: none; user-select: none; }
.faq-item__summary::-webkit-details-marker { display: none; }
.faq-item__marker { width: 10px; height: 10px; border-radius: var(--border-radius-sm); background: var(--bg-brand); box-shadow: 0 2px 0 rgba(0,0,0,0.04); flex: 0 0 10px; transform-origin: center; transition: transform .18s cubic-bezier(.2,.9,.25,1), background .15s ease; }
.faq-item__question { font-family: var(--font-label-lg-family); font-size: var(--font-label-lg-size); font-weight: var(--font-label-lg-weight); color: var(--fg-on-default); flex: 1 1 auto; }
.faq-item__chevron { color: var(--fg-secondary); transition: transform .18s cubic-bezier(.2,.9,.25,1), color .15s ease; transform-origin: center; }
.faq-item__content { padding: 0 var(--spacing-md) var(--spacing-md); color: var(--fg-secondary); font-family: var(--font-body-md-family); font-size: var(--font-body-md-size); line-height: var(--font-body-md-line-height); }
.faq-item[open] { box-shadow: var(--shadow-md); }
.faq-item[open] .faq-item__marker { transform: rotate(45deg) scale(1.05); background: var(--brand-accent); }
.faq-item[open] .faq-item__chevron { transform: rotate(180deg); color: var(--brand-primary); }
.faq-item__summary:focus-visible { outline: 3px solid var(--brand-primary); outline-offset: 3px; border-radius: calc(var(--border-radius-md) - 2px); }
.faq-item__summary:hover { transform: translateY(-4px); }
.faq-item__summary:active { transform: translateY(-2px) scale(0.99); }
.faq-item__content p:last-child { margin-bottom: 0; }
@media (prefers-reduced-motion: reduce) {
  .faq-item, .faq-item__marker, .faq-item__chevron, .faq-item__summary { transition: none !important; }
}
@media (max-width: 520px) {
  .faq-item__summary { padding: calc(var(--spacing-sm) + 2px) var(--spacing-sm); }
  .faq-item__content { padding: 0 var(--spacing-sm) var(--spacing-sm); }
}

.atom-contact { max-width: 760px; width: 100%; margin: 0 auto; font-family: var(--font-body-md-family); }
.atom-contact__card { background: var(--bg-surface-high); border: 1px solid var(--border-color-default); border-radius: var(--border-radius-lg); padding: var(--spacing-md); box-shadow: var(--shadow-sm); }
.atom-contact__title { display: block; font-family: var(--font-title-lg-family); font-size: var(--font-title-lg-size); color: var(--fg-on-default); margin-bottom: .25rem; }
.atom-contact__intro { color: var(--fg-secondary); margin-bottom: var(--spacing-sm); }
.atom-contact__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--spacing-sm); }
.atom-contact__field { display: flex; flex-direction: column; }
.atom-contact__field--span { grid-column: 1 / -1; }
.atom-contact__label { font-family: var(--font-label-md-family); font-size: var(--font-label-md-size); font-weight: var(--font-label-md-weight); color: var(--fg-on-default); margin-bottom: .35rem; }
.atom-contact__input, .atom-contact__textarea { background: var(--bg-default); color: var(--fg-on-default); border: 1px solid var(--border-color-default); border-radius: var(--border-radius-sm); padding: .6rem .75rem; transition: box-shadow .15s cubic-bezier(.2,.9,.25,1), transform .15s cubic-bezier(.2,.9,.25,1), border-color .15s ease; font: inherit; }
.atom-contact__textarea { resize: vertical; min-height: 8rem; }
.atom-contact__input:focus, .atom-contact__textarea:focus { outline: 3px solid rgba(108,31,43,0.12); outline-offset: 2px; border-color: var(--brand-primary); box-shadow: 0 6px 18px rgba(108,31,43,0.06); }
.atom-contact__input[disabled], .atom-contact__textarea[disabled] { color: var(--fg-disabled); border-color: var(--border-color-subtle); }
.atom-contact__honeypot { position: absolute; left: -9999px; height: 0; width: 0; overflow: hidden; }
.atom-contact__actions { display: flex; align-items: center; gap: var(--spacing-md); margin-top: var(--spacing-md); }
.atom-contact__submit { display: inline-flex; align-items: center; gap: .5rem; background: var(--brand-primary); color: var(--fg-on-brand); padding: .6rem .9rem; border-radius: var(--border-radius-md); box-shadow: var(--shadow-sm); transition: transform .18s cubic-bezier(.2,.9,.25,1), box-shadow .18s cubic-bezier(.2,.9,.25,1), background-color .12s ease; font-weight: 600; }
.atom-contact__submit i { font-size: 1rem; line-height: 1; }
.atom-contact__submit:hover { transform: translateY(-4px); background: var(--brand-primary-hover); box-shadow: var(--shadow-md); }
.atom-contact__submit:active { transform: scale(.98); box-shadow: 0 4px 10px rgba(11,11,11,0.08); }
.atom-contact__submit:focus { outline: 3px solid rgba(108,31,43,0.14); outline-offset: 2px; }
.atom-contact__status { margin: 0; font-size: .9375rem; color: var(--fg-secondary); }
.atom-contact__status[data-state="success"] { color: var(--color-success); }
.atom-contact__status[data-state="error"] { color: var(--color-error); }
@media (max-width: 700px) { .atom-contact__grid { grid-template-columns: 1fr; } .atom-contact__actions { flex-direction: column; align-items: stretch; } .atom-contact__submit { width: 100%; justify-content: center; } }

.popin-conversion { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; z-index: 1200; font-family: var(--font-body-md-family); }
.popin-conversion[hidden] { display: none; }
.popin-conversion.is-open { display: flex; }
.popin-conversion__backdrop { position: absolute; inset: 0; background: color-mix(in srgb, var(--bg-inverse) 40%, transparent); backdrop-filter: blur(4px); transition: opacity var(--transition-fast); opacity: 0; }
.popin-conversion.is-open .popin-conversion__backdrop { opacity: 1; }
.popin-conversion__panel { position: relative; width: min(92%, 720px); background: var(--bg-surface-high); color: var(--fg-on-default); border-radius: var(--border-radius-lg); box-shadow: var(--shadow-lg); padding: calc(var(--spacing-md)) calc(var(--spacing-lg)); transform: translateY(8px); transition: transform 160ms cubic-bezier(.2,.9,.25,1), box-shadow 160ms cubic-bezier(.2,.9,.25,1); border-top: 6px solid var(--brand-primary); }
.popin-conversion.is-open .popin-conversion__panel { transform: translateY(0); }
.popin-conversion__close { position: absolute; top: calc(var(--spacing-sm)); right: calc(var(--spacing-sm)); width: 36px; height: 36px; display: inline-grid; place-items: center; color: var(--fg-on-default); background: transparent; border-radius: var(--border-radius-full); transition: transform var(--transition-fast), background var(--transition-fast); }
.popin-conversion__close:focus { outline: 2px solid var(--brand-primary); outline-offset: 2px; }
.popin-conversion__close:hover { transform: translateY(-3px); }
.popin-conversion__header { margin-bottom: var(--spacing-md); }
.popin-conversion__title { font-family: var(--font-title-lg-family); font-size: var(--font-title-lg-size); font-weight: var(--font-title-lg-weight); color: var(--fg-on-default); margin: 0 0 .5rem; }
.popin-conversion__argument { color: var(--fg-secondary); margin: 0 0 0.75rem; }
.popin-conversion__social { margin: 0 0 var(--spacing-md); }
.popin-conversion__quote { margin: 0; padding: .75rem 1rem; background: var(--bg-subtle); color: var(--fg-on-subtle); border-left: 4px solid var(--brand-secondary); border-radius: var(--border-radius-sm); font-style: normal; }
.popin-conversion__footer { display: flex; gap: var(--spacing-md); align-items: center; justify-content: flex-start; }
.popin-conversion__cta { display: inline-block; padding: .65rem 1rem; background: var(--brand-primary); color: var(--fg-on-brand); border-radius: var(--border-radius-md); box-shadow: var(--shadow-md); transition: transform 160ms cubic-bezier(.2,.9,.25,1), box-shadow 160ms cubic-bezier(.2,.9,.25,1), background 120ms ease; font-weight: 600; }
.popin-conversion__cta:focus { outline: 2px solid color-mix(in srgb, var(--brand-primary) 60%, var(--bg-default)); outline-offset: 2px; }
.popin-conversion__cta:hover { transform: translateY(-4px); background: var(--brand-primary-hover); box-shadow: var(--shadow-lg); }
.popin-conversion__cta:active { transform: scale(.98); box-shadow: var(--shadow-md); }
@media (prefers-reduced-motion: reduce) { .popin-conversion__panel, .popin-conversion__backdrop, .popin-conversion__cta, .popin-conversion__close { transition: none; } }
@media (max-width: 520px) { .popin-conversion__panel { padding: calc(var(--spacing-md)) calc(var(--spacing-md)); border-radius: var(--border-radius-md); } .popin-conversion__title { font-size: var(--font-headline-sm-size); } }
:root [data-theme="dark"] .popin-conversion__panel { background: var(--bg-inverse); color: var(--fg-on-inverse); }
:root [data-theme="dark"] .popin-conversion__quote { background: rgba(255,255,255,0.03); color: var(--fg-on-inverse); border-left-color: var(--brand-secondary); }
:root [data-theme="dark"] .popin-conversion__cta { background: var(--brand-accent); color: var(--fg-on-accent); }

.atom-popin-newsletter-banner-top { position: fixed; top: 0; left: 0; right: 0; display: none; z-index: 1120; }
.atom-popin-newsletter-banner-top[hidden] { display: none; }
.atom-popin-newsletter-banner-top.is-open { display: block; }
.atom-popin-newsletter-banner-top__inner { max-width: var(--container-max-width); margin: 0 auto; background: linear-gradient(90deg, var(--bg-subtle), var(--bg-surface-high)); display: flex; gap: var(--spacing-md); align-items: center; padding: calc(var(--spacing-sm)) var(--spacing-container-padding); box-shadow: var(--shadow-md); border-bottom: 1px solid var(--border-color-default); }
.atom-popin-newsletter-banner-top__content { flex: 1; }
.atom-popin-newsletter-banner-top__title { margin: 0; color: var(--brand-primary); font-weight: 700; }
.atom-popin-newsletter-banner-top__argument { margin: 0; color: var(--fg-secondary); }
.atom-popin-newsletter-banner-top__form { display: flex; gap: var(--spacing-xs); align-items: center; }
.atom-popin-newsletter-banner-top__input { padding: calc(var(--spacing-xs) * 1.2) calc(var(--spacing-sm)); border-radius: var(--border-radius-md); border: 1px solid var(--border-color-default); background: var(--bg-default); color: var(--fg-on-default); }
.atom-popin-newsletter-banner-top__input:focus { outline: 3px solid rgba(108,31,43,0.12); outline-offset: 2px; }
.atom-popin-newsletter-banner-top__cta { background: var(--brand-primary); color: var(--fg-on-brand); padding: calc(var(--spacing-xs) * 1.1) calc(var(--spacing-md)); border-radius: var(--border-radius-sm); font-weight: 700; transition: transform var(--transition-fast); }
.atom-popin-newsletter-banner-top__cta:hover { transform: translateY(-4px); background: var(--brand-primary-hover); }
.atom-popin-newsletter-banner-top__close { margin-left: var(--spacing-sm); width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--border-radius-sm); }
.atom-popin-newsletter-banner-top__inner::before { content: ""; position: absolute; left: 12px; top: 12px; width: 8px; height: 8px; background: var(--brand-accent); border-radius: 2px; opacity: 0.12; }
.atom-popin-newsletter-banner-top .visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
@media (max-width: 640px) { .atom-popin-newsletter-banner-top__inner { flex-direction: column; align-items: stretch; gap: var(--spacing-sm); } .atom-popin-newsletter-banner-top__form { width: 100%; } }

.atom-popin-newsletter-center { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; z-index: 1100; }
.atom-popin-newsletter-center[hidden] { display: none; }
.atom-popin-newsletter-center.is-open { display: flex; }
.atom-popin-newsletter-center__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(2px); transition: opacity var(--transition-fast); opacity: 0; }
.atom-popin-newsletter-center.is-open .atom-popin-newsletter-center__backdrop { opacity: 1; }
.atom-popin-newsletter-center__panel { position: relative; width: min(680px, calc(100% - (var(--spacing-container-padding) * 2))); margin: 0 var(--spacing-container-padding); background: var(--bg-surface-high); color: var(--fg-on-default); border-radius: var(--border-radius-lg); padding: calc(var(--spacing-lg)); box-shadow: var(--shadow-lg); transform: translateY(8px) scale(0.995); transition: transform 180ms cubic-bezier(.2,.9,.25,1), opacity 160ms ease; opacity: 0; }
.atom-popin-newsletter-center.is-open .atom-popin-newsletter-center__panel { transform: translateY(0) scale(1); opacity: 1; }
.atom-popin-newsletter-center__close { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border-radius: var(--border-radius-sm); display: grid; place-items: center; color: var(--fg-on-default); background: transparent; transition: transform var(--transition-fast), background var(--transition-fast); }
.atom-popin-newsletter-center__close:focus { outline: 2px solid var(--brand-primary); outline-offset: 2px; }
.atom-popin-newsletter-center__close:hover { transform: translateY(-2px); }
.atom-popin-newsletter-center__title { margin: 0 0 var(--spacing-sm); font-family: var(--font-title-lg-family); font-size: var(--font-title-lg-size); color: var(--fg-on-default); }
.atom-popin-newsletter-center__argument { margin: 0 0 var(--spacing-md); color: var(--fg-secondary); }
.atom-popin-newsletter-center__form { display: flex; gap: var(--spacing-sm); align-items: center; }
.atom-popin-newsletter-center__label { flex: 1; }
.atom-popin-newsletter-center__input { width: 100%; padding: calc(var(--spacing-sm) * 0.9) calc(var(--spacing-md)); border-radius: var(--border-radius-md); border: 1px solid var(--border-color-default); background: var(--bg-default); color: var(--fg-on-default); transition: box-shadow var(--transition-fast), border-color var(--transition-fast); }
.atom-popin-newsletter-center__input:focus { box-shadow: 0 0 0 4px rgba(108,31,43,0.08); border-color: var(--brand-primary); outline: none; }
.atom-popin-newsletter-center__cta { background: var(--brand-primary); color: var(--fg-on-brand); padding: calc(var(--spacing-sm) * 0.9) calc(var(--spacing-md)); border-radius: var(--border-radius-sm); font-weight: 600; transition: transform var(--transition-fast), background 120ms ease, box-shadow 120ms ease; box-shadow: var(--shadow-sm); }
.atom-popin-newsletter-center__cta:hover { transform: translateY(-4px); background: var(--brand-primary-hover); box-shadow: var(--shadow-md); }
.atom-popin-newsletter-center__cta:active { transform: scale(0.98); box-shadow: var(--shadow-sm); }
.atom-popin-newsletter-center__cta:focus { outline: 3px solid rgba(108,31,43,0.18); outline-offset: 2px; }
.atom-popin-newsletter-center__panel::after { content: ""; position: absolute; left: 18px; top: -10px; width: 36px; height: 8px; background: var(--bg-surface-high); transform: rotate(6deg); border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; opacity: 0.06; }
.atom-popin-newsletter-center .visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
@media (prefers-reduced-motion: reduce) { .atom-popin-newsletter-center__panel, .atom-popin-newsletter-center__backdrop { transition: none; } }

.atom-popin-newsletter-slide-br { position: fixed; right: var(--spacing-container-padding); bottom: var(--spacing-container-padding); display: none; z-index: 1050; }
.atom-popin-newsletter-slide-br[hidden] { display: none; }
.atom-popin-newsletter-slide-br.is-open { display: block; }
.atom-popin-newsletter-slide-br__card { width: 320px; max-width: calc(100vw - (var(--spacing-container-padding) * 2)); background: var(--bg-surface-high); color: var(--fg-on-default); border-radius: var(--border-radius-lg); padding: calc(var(--spacing-sm) * 1.2); box-shadow: var(--shadow-md); transform: translateY(14px) scale(0.99); opacity: 0; transition: transform 180ms cubic-bezier(.2,.9,.25,1), opacity 160ms ease; }
.atom-popin-newsletter-slide-br.is-open .atom-popin-newsletter-slide-br__card { transform: translateY(0) scale(1); opacity: 1; }
.atom-popin-newsletter-slide-br__close { position: absolute; top: 8px; right: 8px; width: 34px; height: 34px; display: grid; place-items: center; border-radius: var(--border-radius-sm); }
.atom-popin-newsletter-slide-br__title { margin: 0 0 var(--spacing-xs); font-size: var(--font-title-md-size); }
.atom-popin-newsletter-slide-br__argument { margin: 0 0 var(--spacing-sm); color: var(--fg-secondary); font-size: var(--font-body-sm-size); }
.atom-popin-newsletter-slide-br__form { display: flex; gap: var(--spacing-xs); align-items: center; }
.atom-popin-newsletter-slide-br__input { flex: 1; padding: calc(var(--spacing-xs) * 1.2) calc(var(--spacing-sm)); border-radius: var(--border-radius-sm); border: 1px solid var(--border-color-default); background: var(--bg-default); color: var(--fg-on-default); }
.atom-popin-newsletter-slide-br__input:focus { outline: 3px solid rgba(108,31,43,0.12); outline-offset: 2px; }
.atom-popin-newsletter-slide-br__cta { background: var(--brand-accent); color: var(--fg-on-accent); padding: calc(var(--spacing-xs) * 1.1) calc(var(--spacing-sm)); border-radius: var(--border-radius-full); font-weight: 600; transition: transform var(--transition-fast), box-shadow var(--transition-fast); box-shadow: none; }
.atom-popin-newsletter-slide-br__cta:hover { transform: translateY(-4px); box-shadow: var(--shadow-sm); background: var(--brand-accent-hover); }
.atom-popin-newsletter-slide-br__card::before { content: ""; position: absolute; left: -10px; top: -10px; width: 28px; height: 28px; background: var(--bg-surface-high); transform: rotate(12deg); opacity: 0.05; border-radius: 6px; }
@media (prefers-reduced-motion: reduce) { .atom-popin-newsletter-slide-br__card { transition: none; } }

.popin-notifs { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; padding: var(--spacing-container-padding); z-index: 1200; }
.popin-notifs[hidden] { display: none; }
.popin-notifs.is-open { display: flex; }
.popin-notifs__surface { width: min(520px, calc(100% - (var(--spacing-container-padding) * 2))); background: var(--bg-surface-high); color: var(--fg-on-default); border-radius: var(--border-radius-lg); box-shadow: var(--shadow-md); padding: calc(var(--spacing-md)); display: flex; flex-direction: column; gap: var(--spacing-sm); transform: translateY(0); transition: transform .18s cubic-bezier(.2,.9,.25,1), box-shadow .18s cubic-bezier(.2,.9,.25,1); }
.popin-notifs__surface:focus { outline: none; }
.popin-notifs__header { display: flex; align-items: center; justify-content: space-between; gap: var(--spacing-sm); }
.popin-notifs__title { font-family: var(--font-title-lg-family); font-size: var(--font-title-lg-size); font-weight: var(--font-title-lg-weight); margin: 0; }
.popin-notifs__close { width: 36px; height: 36px; display: inline-grid; place-items: center; border-radius: var(--border-radius-sm); color: var(--fg-secondary); transition: background .15s ease, transform .12s ease; }
.popin-notifs__close:focus { box-shadow: 0 0 0 3px rgba(108,31,43,0.14); }
.popin-notifs__close:hover { background: var(--bg-subtle); transform: translateY(-2px); }
.popin-notifs__body { padding-top: .25rem; }
.popin-notifs__text { margin: 0; color: var(--fg-secondary); }
.popin-notifs__footer { display: flex; gap: var(--spacing-sm); align-items: center; justify-content: flex-end; margin-top: var(--spacing-sm); }
.popin-notifs__btn { padding: .6rem .9rem; border-radius: var(--border-radius-md); font-weight: 600; transition: transform .12s cubic-bezier(.2,.9,.25,1), box-shadow .15s ease; box-shadow: var(--shadow-sm); }
.popin-notifs__btn:active { transform: scale(.98); }
.popin-notifs__btn:focus { outline: 3px solid rgba(108,31,43,0.14); }
.popin-notifs__btn--primary { background: var(--brand-primary); color: var(--fg-on-brand); }
.popin-notifs__btn--primary:hover { background: var(--brand-primary-hover); transform: translateY(-4px); box-shadow: var(--shadow-md); }
.popin-notifs__btn--ghost { background: transparent; color: var(--brand-primary); border: 1px solid var(--border-color-default); }
.popin-notifs__btn--ghost:hover { background: var(--bg-subtle); transform: translateY(-4px); }
.popin-notifs__btn--disabled { background: var(--bg-surface-low); color: var(--fg-disabled); cursor: default; box-shadow: none; transform: none; }
@media (prefers-reduced-motion: reduce) { .popin-notifs__surface, .popin-notifs__btn { transition: none; } }
[data-theme="dark"] .popin-notifs__surface { background: var(--bg-inverse); color: var(--fg-on-inverse); box-shadow: var(--shadow-lg); }
[data-theme="dark"] .popin-notifs__text { color: var(--fg-on-inverse); }
[data-theme="dark"] .popin-notifs__btn--ghost { color: var(--fg-on-inverse); border-color: rgba(255,255,255,0.08); }
.popin-notifs__brand-notch { position: absolute; left: 18px; top: -10px; width: 40px; height: 10px; background: var(--brand-accent); border-radius: 4px 4px 0 0; box-shadow: none; }
.popin-notifs__surface { position: relative; }
.popin-notifs__surface::before { content: ""; position: absolute; left: 18px; top: -14px; width: 60px; height: 14px; background: linear-gradient(90deg, transparent, rgba(0,0,0,0.02)); border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; opacity: .6; pointer-events: none; }
.popin-notifs__signature-line { height: 4px; width: 72px; background: var(--brand-primary); border-radius: var(--border-radius-sm); margin-top: var(--spacing-sm); }
.popin-notifs__body { display: flex; flex-direction: column; gap: .5rem; }
.popin-notifs[aria-hidden="true"] { display: none; }

.reassurance { padding: var(--spacing-sm) var(--spacing-container-padding); background: var(--bg-subtle); border-radius: var(--border-radius-md); }
.reassurance__list { display: flex; gap: var(--spacing-md); align-items: center; justify-content: center; margin: 0; padding: 0; }
.reassurance__item { display: inline-flex; align-items: center; gap: .5rem; padding: .5rem .75rem; background: transparent; border-radius: var(--border-radius-md); transition: transform .18s cubic-bezier(.2,.9,.25,1), box-shadow .18s cubic-bezier(.2,.9,.25,1); }
.reassurance__icon { font-size: 1.125rem; color: var(--brand-primary); display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; border-radius: .5rem; }
.reassurance__text { font-family: var(--font-label-lg-family); font-size: var(--font-label-lg-size); font-weight: var(--font-label-lg-weight); color: var(--fg-on-default); }
.reassurance__item:hover, .reassurance__item:focus-within { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.reassurance__item:active { transform: scale(.98); box-shadow: 0 3px 8px rgba(11,11,11,0.08); }
.reassurance__item:focus-within { outline: 3px solid var(--brand-accent); outline-offset: 2px; }
@media (max-width: 640px) {
  .reassurance__list { gap: var(--spacing-sm); flex-wrap: wrap; }
  .reassurance__item { flex: 1 1 45%; justify-content: flex-start; }
}
@media (prefers-color-scheme: dark) {
  .reassurance { background: var(--bg-inverse); }
  .reassurance__text { color: var(--fg-on-inverse); }
  .reassurance__icon { color: var(--brand-accent); }
}

.reassurance-grid { padding: var(--spacing-md); background: var(--bg-surface-high); border-radius: var(--border-radius-lg); box-shadow: var(--shadow-sm); }
.reassurance-grid__title { margin: 0 0 var(--spacing-sm); font-family: var(--font-headline-md-family); font-size: var(--font-headline-md-size); color: var(--fg-on-default); }
.reassurance-grid__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--spacing-md); }
.reassurance-grid__card { background: var(--bg-default); padding: var(--spacing-md); border-radius: var(--border-radius-md); box-shadow: var(--shadow-md); transition: transform .18s cubic-bezier(.2,.9,.25,1), box-shadow .18s cubic-bezier(.2,.9,.25,1); display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; position: relative; overflow: visible; }
.reassurance-grid__card::after { content: ""; position: absolute; right: 12px; top: -8px; width: 36px; height: 8px; background: var(--bg-accent); border-radius: 4px 4px 0 0; transform: rotate(-6deg); opacity: .08; }
.reassurance-grid__icon { font-size: 1.375rem; color: var(--bg-brand); width: 2.25rem; height: 2.25rem; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--border-radius-sm); background: rgba(108,31,43,0.06); }
.reassurance-grid__heading { margin: 0; font-family: var(--font-title-md-family); font-size: var(--font-title-md-size); color: var(--fg-on-default); }
.reassurance-grid__desc { margin: 0; color: var(--fg-secondary); font-size: var(--font-body-sm-size); line-height: 1.4; }
.reassurance-grid__card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.reassurance-grid__card:active { transform: scale(.99); box-shadow: var(--shadow-md); }
.reassurance-grid__card:focus-within { outline: 3px solid var(--brand-primary); outline-offset: 4px; }
@media (max-width: 980px) {
  .reassurance-grid__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
  .reassurance-grid__grid { grid-template-columns: 1fr; }
  .reassurance-grid { padding: var(--spacing-sm); }
}
@media (prefers-color-scheme: dark) {
  .reassurance-grid { background: var(--bg-inverse); }
  .reassurance-grid__card { background: var(--bg-inverse); }
  .reassurance-grid__icon { color: var(--brand-accent); background: rgba(194,75,82,0.06); }
  .reassurance-grid__heading { color: var(--fg-on-inverse); }
  .reassurance-grid__desc { color: var(--fg-secondary); }
}

.atom-social { --size: 2.25rem; display: inline-block; }
.atom-social__list { display: flex; gap: var(--spacing-sm); margin: 0; padding: 0; align-items: center; }
.atom-social__item { list-style: none; }
.atom-social__link {
  display: inline-grid; place-items: center; width: var(--size); height: var(--size);
  border-radius: var(--border-radius-md); background: var(--bg-surface-high);
  color: var(--fg-on-default); box-shadow: var(--shadow-sm);
  transition: transform 120ms cubic-bezier(.2,.9,.25,1), box-shadow 120ms cubic-bezier(.2,.9,.25,1), background 120ms cubic-bezier(.2,.9,.25,1);
  border: 1px solid var(--border-color-subtle);
}
.atom-social__link i { font-size: 1.125rem; line-height: 1; }
.atom-social__link:focus { outline: 3px solid var(--brand-primary); outline-offset: 2px; border-radius: calc(var(--border-radius-md) + 1px); }
.atom-social__link:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); background: var(--bg-subtle); }
.atom-social__link:active { transform: scale(.98); box-shadow: var(--shadow-sm); }
.atom-social__link[aria-label="Instagram"] { background: var(--bg-accent); color: var(--fg-on-accent); }
.atom-social__link[aria-label="Instagram"]:hover { background: var(--brand-accent-hover); }
.atom-social__link[aria-label="Facebook"] { background: var(--brand-primary); color: var(--fg-on-brand); }
.atom-social__link[aria-label="Facebook"]:hover { background: var(--brand-primary-hover); }
.atom-social__link[aria-label="X"] { background: var(--bg-surface-high); color: var(--fg-on-default); }
.atom-social__link[aria-label="X"]:hover { background: var(--bg-subtle); }
.atom-social__link[aria-label="YouTube"] { background: var(--brand-secondary); color: var(--fg-on-brand); }
.atom-social__link[aria-label="YouTube"]:hover { background: var(--brand-secondary-hover); }
.atom-social__link[aria-label="Pinterest"] { background: var(--bg-surface-high); color: var(--brand-accent); border-color: var(--border-color-strong); }
.atom-social__link[aria-label="Pinterest"]:hover { background: var(--bg-subtle); }
@media (prefers-reduced-motion: reduce) {
  .atom-social__link { transition: none; }
}
@media (prefers-color-scheme: dark) {
  .atom-social { }
  .atom-social__link { background: var(--bg-inverse); color: var(--fg-on-inverse); border-color: rgba(255,255,255,0.06); box-shadow: 0 1px 2px rgba(0,0,0,0.6); }
  .atom-social__link[aria-label="Instagram"] { background: var(--brand-accent); color: var(--fg-on-accent); }
  .atom-social__link[aria-label="Facebook"] { background: var(--brand-primary); color: var(--fg-on-brand); }
  .atom-social__link[aria-label="YouTube"] { background: var(--brand-secondary); color: var(--fg-on-brand); }
}
.atom-social__link::after { content: ""; position: absolute; width: calc(var(--size) + 8px); height: calc(var(--size) + 8px); border-radius: calc(var(--border-radius-md) + 2px); opacity: 0; transform: translateY(6px); transition: opacity 160ms cubic-bezier(.2,.9,.25,1), transform 160ms cubic-bezier(.2,.9,.25,1); pointer-events: none; }
.atom-social__link:hover::after { opacity: .06; transform: translateY(0); background: var(--brand-primary); }
.atom-social { position: relative; }

.atom-testimonial {
  background: var(--bg-surface-high);
  color: var(--fg-on-default);
  border: 1px solid var(--border-color-subtle);
  padding: calc(var(--spacing-sm) + 0.25rem) calc(var(--spacing-md));
  border-radius: var(--border-radius-lg);
  max-width: 54rem;
  box-shadow: var(--shadow-sm);
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-sm);
  transition: transform .15s cubic-bezier(.2,.9,.25,1), box-shadow .15s cubic-bezier(.2,.9,.25,1);
}
.atom-testimonial:focus-within {
  outline: 2px solid var(--brand-primary);
  outline-offset: 3px;
}
.atom-testimonial__quote {
  margin: 0;
  font-style: normal;
  color: var(--fg-on-default);
  padding-left: calc(var(--spacing-sm) + 0.5rem);
  position: relative;
}
.atom-testimonial__quote::before {
  content: "\201C";
  position: absolute;
  left: 0;
  top: -6px;
  font-size: 1.6rem;
  color: var(--brand-accent);
  line-height: 1;
  transform: translateY(-10%);
}
.atom-testimonial__meta {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  margin-top: 0.25rem;
}
.atom-testimonial__avatar-wrap {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border-radius: var(--border-radius-full);
  overflow: hidden;
  box-shadow: 0 4px 10px rgba(108,31,43,0.08);
  border: 2px solid var(--bg-subtle);
}
.atom-testimonial__avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.atom-testimonial__info {
  display: flex;
  flex-direction: column;
}
.atom-testimonial__name {
  font-family: var(--font-title-lg-family);
  font-size: var(--font-title-lg-size);
  font-weight: var(--font-title-lg-weight);
  color: var(--fg-on-default);
}
.atom-testimonial__role {
  font-family: var(--font-body-sm-family);
  font-size: var(--font-body-sm-size);
  color: var(--fg-secondary);
}
.atom-testimonial:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.atom-testimonial:active {
  transform: scale(.98);
  box-shadow: var(--shadow-sm);
}
@media (prefers-reduced-motion: reduce) {
  .atom-testimonial { transition: none; }
  .atom-testimonial:hover, .atom-testimonial:active { transform: none; box-shadow: var(--shadow-sm); }
}