/* ============================================================
 * dh-v2.css — core system for the optimized deinehaut store (v2)
 *   tokens · reset · type · grain · header · anchor nav ·
 *   hero · marquee · buttons · sticky buy bar · footer
 * Direction: warm editorial apothecary-luxury. Same brand
 * palette + fonts as v1, elevated with depth, rhythm, motion.
 * ============================================================ */

/* ---------- Fonts (real brand faces, variable weight) ---------- */
@font-face { font-family:"Fraunces"; src:url("/assets/fonts/fraunces-wght-normal.woff2") format("woff2"); font-weight:100 900; font-style:normal; font-display:swap; }
@font-face { font-family:"Fraunces"; src:url("/assets/fonts/fraunces-wght-italic.woff2") format("woff2"); font-weight:100 900; font-style:italic; font-display:swap; }
@font-face { font-family:"Hanken Grotesk"; src:url("/assets/fonts/hanken-grotesk-wght-normal.woff2") format("woff2"); font-weight:100 900; font-style:normal; font-display:swap; }
@font-face { font-family:"Hanken Grotesk"; src:url("/assets/fonts/hanken-grotesk-wght-italic.woff2") format("woff2"); font-weight:100 900; font-style:italic; font-display:swap; }
@font-face { font-family:"JetBrains Mono"; src:url("/assets/fonts/jetbrains-mono-wght-normal.woff2") format("woff2"); font-weight:100 800; font-style:normal; font-display:swap; }
@font-face { font-family:"Caveat"; src:url("/assets/fonts/caveat-wght-normal.woff2") format("woff2"); font-weight:400 700; font-style:normal; font-display:swap; }

/* ---------- Tokens ---------- */
:root {
  --ink:#1F1D1A;
  --ink-2:#3a352f;
  --ink-3:#6c655c;
  --sand:#F5F0E6;
  --sand-2:#efe7d6;
  --bone:#ECE0C7;
  --paper:#FBF8F1;
  --terra:#B85543;
  --terra-deep:#9c4131;
  --terra-soft:#cd8576;
  --gold:#CCAB68;
  --tan:#B8895A;

  --c-foundation:#C6982F;
  --c-tone:#7c8a55;
  --c-clear:#C2603B;
  --c-biome:#5d80a8;

  --line:rgba(31,29,26,.13);
  --line-2:rgba(31,29,26,.07);
  --line-light:rgba(245,240,230,.22);

  --serif:"Fraunces", Georgia, "Times New Roman", serif;
  --sans:"Hanken Grotesk", system-ui, -apple-system, sans-serif;
  --mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;
  --script:"Caveat", "Segoe Script", cursive;

  --fs-display:clamp(2.55rem, 1.1rem + 5.4vw, 5.4rem);
  --fs-h2:clamp(1.95rem, 1.15rem + 2.5vw, 3.35rem);
  --fs-h3:clamp(1.25rem, 1.02rem + .9vw, 1.7rem);
  --fs-lead:clamp(1.06rem, .99rem + .4vw, 1.32rem);
  --fs-body:1.0625rem;
  --fs-eyebrow:.74rem;

  --maxw:1240px;
  --maxw-narrow:920px;
  --gut:clamp(1.2rem, 4vw, 3rem);
  --space-section:clamp(4.5rem, 3rem + 6vw, 8.5rem);

  --radius:18px;
  --radius-lg:28px;
  --radius-sm:11px;

  --shadow-sm:0 1px 2px rgba(31,29,26,.05), 0 5px 14px rgba(31,29,26,.05);
  --shadow-md:0 2px 6px rgba(31,29,26,.05), 0 16px 38px rgba(31,29,26,.10);
  --shadow-lg:0 8px 22px rgba(31,29,26,.09), 0 34px 70px rgba(31,29,26,.16);
  --shadow-terra:0 22px 60px rgba(120,46,33,.42);

  --ease:cubic-bezier(.22,1,.36,1);
  --ease-soft:cubic-bezier(.16,1,.3,1);
  --dur:.7s;
}

/* ---------- Reset / base ---------- */
*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
body {
  margin:0;
  font-family:var(--sans);
  font-size:var(--fs-body);
  line-height:1.62;
  color:var(--ink);
  background:var(--sand);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration:none; }
button { font:inherit; color:inherit; cursor:pointer; }
h1,h2,h3,h4 { margin:0; font-family:var(--serif); font-weight:480; line-height:1.06; letter-spacing:-.01em; }
p { margin:0; }
ul,ol { margin:0; padding:0; list-style:none; }
:focus-visible { outline:2px solid var(--terra); outline-offset:3px; border-radius:3px; }
.v2-hero :focus-visible { outline-color:var(--paper); }

/* ---------- Film-grain atmosphere overlay ---------- */
body::before {
  content:""; position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.5;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.045'/%3E%3C/svg%3E");
}

/* ---------- Layout helpers ---------- */
.v2-wrap { width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gut); }
.v2-wrap--narrow { max-width:var(--maxw-narrow); }
.v2-section { position:relative; z-index:2; padding-block:var(--space-section); }
.v2-eyebrow {
  font-family:var(--mono); font-size:var(--fs-eyebrow); font-weight:500;
  letter-spacing:.22em; text-transform:uppercase; color:var(--terra);
  display:inline-flex; align-items:center; gap:.7em; margin:0;
}
.v2-eyebrow::before { content:""; width:1.8rem; height:1px; background:currentColor; opacity:.6; }
.v2-eyebrow--center { justify-content:center; }
.v2-eyebrow--center::before { display:none; }
.v2-display { font-size:var(--fs-display); letter-spacing:-.022em; line-height:1.0; }
.v2-h2 { font-size:var(--fs-h2); line-height:1.04; }
.v2-lead { font-size:var(--fs-lead); color:var(--ink-2); line-height:1.55; }
em.v2-ink-accent, .v2-display em, .v2-h2 em { font-style:italic; color:var(--terra); }

.v2-section-head { max-width:60ch; margin-inline:auto; text-align:center; display:flex; flex-direction:column; gap:1.1rem; align-items:center; }
.v2-section-head .v2-lead { color:var(--ink-3); }

/* ---------- Buttons ---------- */
.v2-btn {
  --bg:var(--ink); --fg:var(--paper);
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.7em;
  padding:1.05rem 1.7rem; border:1px solid transparent; border-radius:999px;
  background:var(--bg); color:var(--fg); font-family:var(--sans); font-weight:600;
  font-size:1rem; letter-spacing:.005em; line-height:1; white-space:nowrap;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
  box-shadow:var(--shadow-sm);
}
.v2-btn:hover { transform:translateY(-2px); box-shadow:var(--shadow-md); }
.v2-btn:active { transform:translateY(0); }
.v2-btn--primary { --bg:var(--terra); --fg:var(--paper); box-shadow:var(--shadow-terra); }
.v2-btn--primary:hover { --bg:var(--terra-deep); }
.v2-btn--dark { --bg:var(--ink); --fg:var(--paper); }
.v2-btn--ghost { --bg:transparent; --fg:var(--ink); border-color:var(--line); box-shadow:none; }
.v2-btn--ghost:hover { --bg:rgba(31,29,26,.05); box-shadow:none; }
.v2-btn--on-terra.v2-btn--ghost { --fg:var(--paper); border-color:var(--line-light); }
.v2-btn--on-terra.v2-btn--ghost:hover { --bg:rgba(255,255,255,.1); }
.v2-btn--lg { padding:1.2rem 2.1rem; font-size:1.06rem; }
.v2-btn__arrow { transition:transform .3s var(--ease); }
.v2-btn:hover .v2-btn__arrow { transform:translateX(4px); }

/* ---------- Sticky top bar (header + anchor nav move as one unit) ---------- */
.v2-topbar { position:sticky; top:0; z-index:60; transition:transform .45s var(--ease), box-shadow .35s var(--ease); }
.v2-topbar.is-hidden { transform:translateY(-100%); }
.v2-topbar.is-scrolled { box-shadow:var(--shadow-sm); }

/* ---------- Header ---------- */
.v2-header {
  background:color-mix(in srgb, var(--sand) 92%, transparent);
  backdrop-filter:saturate(1.3) blur(14px);
  border-bottom:1px solid var(--line-2);
}
.v2-header__inner { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:1rem; min-height:66px; }

/* ---- Logo lockup: seal mark + serif wordmark with brand dot ---- */
/* Explicit columns so the hidden mobile nav can't collapse grid placement. */
.v2-nav { grid-column:1; }
.v2-logo { grid-column:2; }
.v2-header__actions { grid-column:3; }
.v2-logo { display:inline-flex; align-items:center; gap:.55rem; justify-self:center; color:var(--ink); }
.v2-logo__mark { display:inline-flex; width:31px; height:31px; flex:none; filter:drop-shadow(0 1.5px 2.5px rgba(156,65,49,.32)); transition:transform .4s var(--ease); }
.v2-logo__mark svg { width:100%; height:100%; }
.v2-logo:hover .v2-logo__mark { transform:rotate(-8deg) scale(1.05); }
.v2-logo__word { font-family:var(--serif); font-weight:520; font-size:1.5rem; letter-spacing:-.018em; line-height:1; }
.v2-logo__dot { color:var(--terra); margin-left:.02em; }

.v2-nav { display:none; gap:2.1rem; justify-self:start; }
.v2-nav a { position:relative; font-size:.94rem; color:var(--ink-2); padding:.4rem 0; transition:color .2s var(--ease); }
.v2-nav a::after { content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:var(--terra); transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease); }
.v2-nav a:hover { color:var(--ink); } .v2-nav a:hover::after { transform:scaleX(1); }

.v2-header__actions { display:flex; align-items:center; gap:.4rem; justify-self:end; }
.v2-icon-btn { display:inline-flex; align-items:center; justify-content:center; width:46px; height:46px; border:none; background:none; border-radius:50%; color:var(--ink); transition:background .2s var(--ease); -webkit-tap-highlight-color:transparent; }
.v2-icon-btn:hover { background:rgba(31,29,26,.06); }
.v2-icon-btn svg { width:24px; height:24px; }
.v2-lang { display:none; font-family:var(--mono); font-size:.72rem; letter-spacing:.08em; padding:.5rem .7rem; border-radius:999px; }
.v2-lang:hover { background:rgba(31,29,26,.06); }

/* ---- Cart: prominent, with a real count badge (injected as .cart-count-bubble) ---- */
.v2-header__cart { position:relative; width:48px; height:48px; }
.v2-header__cart svg { width:34px; height:34px; }
.v2-header__cart .cart-count-bubble { position:absolute; top:5px; right:3px; min-width:19px; height:19px; padding:0 5px; border-radius:999px; background:var(--terra); color:var(--paper); font-family:var(--mono); font-size:.64rem; font-weight:600; line-height:1; display:flex; align-items:center; justify-content:center; box-shadow:0 0 0 2px var(--sand); }
.v2-header__cart .cart-count-bubble:empty { display:none; }
.v2-header__cart .cart-count-bubble .visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

@media (min-width:990px){ .v2-nav{ display:inline-flex; } .v2-lang{ display:inline-flex; } }

/* ---------- Anchor nav (part of the sticky topbar unit) ---------- */
.v2-anchornav { background:var(--bone); border-bottom:1px solid var(--line-2); }
.v2-anchornav__inner { display:flex; align-items:center; gap:clamp(1rem,3vw,2.4rem); min-height:46px; overflow-x:auto; scrollbar-width:none; }
.v2-anchornav__inner::-webkit-scrollbar { display:none; }
.v2-anchornav__eyebrow { font-family:var(--mono); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-3); white-space:nowrap; }
.v2-anchornav__list { display:flex; gap:clamp(1rem,2.5vw,2rem); margin-left:auto; }
.v2-anchornav__link { display:inline-flex; align-items:baseline; gap:.5em; font-size:.9rem; color:var(--ink-2); white-space:nowrap; padding:.3rem 0; transition:color .2s var(--ease); }
.v2-anchornav__link:hover { color:var(--terra); }
.v2-anchornav__link.is-active { color:var(--terra); font-weight:600; }
.v2-anchornav__num { font-family:var(--mono); font-size:.66rem; color:var(--terra); }

/* ---------- HERO ---------- */
.v2-hero { position:relative; z-index:2; overflow:hidden; color:var(--paper); background:linear-gradient(155deg,#bd5a47 0%, var(--terra) 42%, var(--terra-deep) 100%); }
.v2-hero__glow { position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(60% 55% at 82% 8%, rgba(255,224,200,.4), transparent 60%),
    radial-gradient(50% 50% at 8% 95%, rgba(120,40,28,.55), transparent 60%);
  mix-blend-mode:soft-light; }
.v2-hero__inner { position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; text-align:center; gap:clamp(1.8rem,3.2vw,2.8rem); padding-block:clamp(2rem,3.4vw,3.2rem); }
.v2-hero__copy { display:flex; flex-direction:column; align-items:center; gap:1.05rem; max-width:42rem; width:100%; }
.v2-hero .v2-eyebrow { color:#ffe6d8; }
.v2-hero .v2-eyebrow::before { display:none; }
.v2-hero__headline { font-size:clamp(2.1rem, 1rem + 3.3vw, 3.9rem); font-weight:680; letter-spacing:-.022em; }
.v2-hero__headline em { font-style:italic; color:#ffd9c2; }

/* Rotating contrast words — calms/irritates pairs roll through in cadence.
 * The slot stays centered and eases its width to fit each word (JS sets the
 * target width, CSS animates it), so the word is always snug and centered while
 * the rest of the line reflows smoothly around it. Only transform/opacity/filter
 * animate on the words; width eases on one small inline box. */
.v2-rotor { position:relative; display:inline-block; vertical-align:baseline; text-align:center; white-space:nowrap; overflow:hidden; transition:width .46s var(--ease-soft); }
/* Once JS wraps the word in an inline-block layer for the roll, the nested
 * inline-block exports a baseline ~0.178em above the line (line-height 1.06 is
 * tighter than Fraunces' natural box), so the word rides high. Drop the slot by
 * that measured amount — only while the animated word exists, so the plain-text
 * pre-JS and reduced-motion states (already pixel-aligned) stay untouched. */
.v2-rotor.is-rotor-live { vertical-align:-0.178em; }
.v2-rotor__word { display:inline-block; -webkit-backface-visibility:hidden; backface-visibility:hidden; }
.v2-rotor__word--incoming { position:absolute; left:0; right:0; }  /* transient layer that rolls in over the outgoing word */
/* Accent underline hugs the live word (width set by JS, centered) and wipes out
 * then redraws with each arrival via a compositor-friendly scaleX sweep. */
.v2-rotor::after { content:""; position:absolute; bottom:.02em; height:.05em; border-radius:2px;
  left:50%; width:var(--rotor-uw, 90%); margin-left:calc(var(--rotor-uw, 90%) / -2);
  background:linear-gradient(90deg, transparent, rgba(255,217,194,.9) 16%, rgba(255,217,194,.9) 84%, transparent);
  transform:scaleX(1); transform-origin:left center; will-change:transform;
  transition:transform .5s var(--ease-soft), width .46s var(--ease-soft), margin-left .46s var(--ease-soft); }
.v2-rotor.is-wiping::after { transform:scaleX(0); transform-origin:right center; transition:transform .26s cubic-bezier(.4,0,.9,.2); }
@media (prefers-reduced-motion:reduce){ .v2-rotor{ width:auto !important; overflow:visible; transition:none; } .v2-rotor::after{ width:90%; margin-left:-45%; } }
.v2-hero__sub { font-size:var(--fs-lead); color:rgba(255,245,238,.9); max-width:34rem; }
.v2-hero__proof { display:flex; align-items:center; justify-content:center; gap:.55rem; font-size:.95rem; color:rgba(255,245,238,.92); }
.v2-stars { color:#ffd27a; letter-spacing:.12em; font-size:1.02rem; }
.v2-hero__proof strong { font-weight:700; }
.v2-hero__cta { display:flex; flex-direction:column; align-items:center; gap:.85rem; margin-top:.3rem; width:100%; max-width:25rem; }
.v2-hero__cta .v2-btn--primary { width:100%; --bg:var(--paper); --fg:var(--ink); box-shadow:0 18px 44px rgba(60,20,12,.4); }
.v2-hero__cta .v2-btn--primary:hover { --bg:#fff; }
.v2-hero__textlink { display:inline-flex; align-items:center; gap:.45em; color:rgba(255,245,238,.92); font-size:.95rem; text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px; transition:gap .25s var(--ease), color .2s var(--ease); }
.v2-hero__textlink:hover { gap:.75em; color:#fff; }
.v2-hero__trustline { display:flex; flex-wrap:wrap; justify-content:center; gap:.4rem .9rem; margin-top:.5rem; font-size:.84rem; color:rgba(255,245,238,.82); }
.v2-hero__trustline span { display:inline-flex; align-items:center; gap:.4em; }
.v2-hero__trustline span::before { content:"✓"; color:#ffd9c2; font-weight:700; }

.v2-hero__media { position:relative; width:100vw; max-width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); margin-top:clamp(1.4rem,3vw,2.4rem); }
.v2-hero__frame { position:relative; margin:0; border-radius:0; overflow:hidden; background:var(--paper); }
.v2-hero__frame img { display:block; width:100%; }
.v2-hero__badge { position:absolute; z-index:3; display:flex; flex-direction:column; gap:.06rem; padding:.42rem .7rem; border-radius:10px; background:var(--paper); color:var(--ink); box-shadow:var(--shadow-md); }
.v2-hero__badge--made { bottom:1rem; right:1rem; transform:rotate(2deg); }
.v2-hero__badge-big { font-family:var(--serif); font-size:.82rem; line-height:1; }
.v2-hero__badge-small { font-family:var(--mono); font-size:.48rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3); }
@media (min-width:760px){
  .v2-hero__badge { padding:.5rem .85rem; }
  .v2-hero__badge--made { bottom:1.6rem; right:1.6rem; }
}

/* ---------- Marquee ---------- */
.v2-marquee { position:relative; z-index:2; overflow:hidden; border-top:1px solid var(--line-light); border-bottom:1px solid var(--line-light); background:rgba(120,40,28,.22); }
.v2-marquee__track { display:flex; width:max-content; animation:v2-marq 42s linear infinite; }
.v2-marquee__group { display:flex; align-items:center; flex-shrink:0; }
.v2-marquee__item { padding:.85rem 0; font-family:var(--mono); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,245,238,.86); white-space:nowrap; }
.v2-marquee__sep { padding:0 1.6rem; color:#ffd9c2; }
@keyframes v2-marq { to { transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .v2-marquee__track{ animation:none; } }
.v2-hero .v2-marquee { background:transparent; }

/* ---------- Sticky buy bar ---------- */
.v2-stickybar {
  position:fixed; left:0; right:0; bottom:0; z-index:70;
  transform:translateY(120%); transition:transform .45s var(--ease);
  background:color-mix(in srgb, var(--paper) 92%, transparent); backdrop-filter:blur(16px) saturate(1.4);
  border-top:1px solid var(--line); box-shadow:0 -10px 40px rgba(31,29,26,.12);
}
.v2-stickybar.is-visible { transform:translateY(0); }
.v2-stickybar__inner { display:flex; align-items:center; gap:1rem; padding-block:.7rem; }
.v2-stickybar__thumb { width:48px; height:48px; border-radius:11px; object-fit:cover; box-shadow:var(--shadow-sm); flex-shrink:0; }
.v2-stickybar__info { display:flex; flex-direction:column; line-height:1.25; min-width:0; }
.v2-stickybar__info strong { font-size:.98rem; font-weight:650; }
.v2-stickybar__info span { font-size:.8rem; color:var(--ink-3); }
.v2-stickybar .v2-btn { margin-left:auto; flex-shrink:0; }
.v2-stickybar__info-sub { display:none; }
@media (max-width:620px){
  .v2-stickybar__info span { font-size:.74rem; }
  .v2-stickybar .v2-btn { padding:.95rem 1.2rem; }
}

/* ---------- Footer ---------- */
.v2-footer { position:relative; z-index:2; background:var(--ink); color:var(--sand); padding-block:clamp(3.5rem,5vw,5.5rem) 2.5rem; }
.v2-footer__grid { display:grid; grid-template-columns:1fr; gap:2.6rem; padding-bottom:3rem; border-bottom:1px solid rgba(245,240,230,.14); }
.v2-footer__brand-name { font-family:var(--serif); font-size:1.9rem; }
.v2-footer__mission { color:rgba(245,240,230,.7); max-width:34ch; margin-top:1rem; }
.v2-footer__col h4 { font-family:var(--mono); font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:rgba(245,240,230,.55); margin-bottom:1.1rem; }
.v2-footer__col li { margin-bottom:.7rem; }
.v2-footer__col a { color:rgba(245,240,230,.85); transition:color .2s var(--ease); }
.v2-footer__col a:hover { color:var(--terra-soft); }
.v2-footer__news { display:flex; gap:.5rem; margin-top:1rem; max-width:24rem; }
.v2-footer__news input { flex:1; min-width:0; padding:.85rem 1rem; border:1px solid rgba(245,240,230,.24); border-radius:999px; background:rgba(245,240,230,.06); color:var(--sand); }
.v2-footer__news input::placeholder { color:rgba(245,240,230,.45); }
.v2-footer__news button { width:48px; height:48px; flex-shrink:0; border-radius:50%; border:none; background:var(--terra); color:var(--paper); display:flex; align-items:center; justify-content:center; transition:background .2s var(--ease), transform .2s var(--ease); }
.v2-footer__news button:hover { background:var(--terra-soft); transform:translateX(2px); }
.v2-footer__bottom { display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between; align-items:center; padding-top:2rem; font-size:.82rem; color:rgba(245,240,230,.55); }
.v2-footer__legal { display:flex; flex-wrap:wrap; gap:1.2rem; }
.v2-footer__legal a:hover { color:var(--sand); }
@media (min-width:760px){ .v2-footer__grid { grid-template-columns:1.4fr 1fr 1fr; } }

/* ---------- Scroll-reveal primitives ---------- */
.v2-reveal { opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease-soft), transform .8s var(--ease-soft); will-change:opacity,transform; }
.v2-reveal.is-in { opacity:1; transform:none; }
.v2-reveal[data-delay="1"]{ transition-delay:.08s; }
.v2-reveal[data-delay="2"]{ transition-delay:.16s; }
.v2-reveal[data-delay="3"]{ transition-delay:.24s; }
.v2-reveal[data-delay="4"]{ transition-delay:.32s; }
@media (prefers-reduced-motion:reduce){ .v2-reveal{ opacity:1; transform:none; transition:none; } }

.v2-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; }