/* Duck Deals — landing & platform stylesheet
   Tokens from the brand handoff (dark water ground + teal accent + amber "bill").
   The renderer emits exact per-element inline styles for decorative values; this file
   owns tokens, resets, keyframes, interaction states, responsiveness and RTL. */

:root {
  --dd-bg:#0c1418; --dd-bg-alt:#0a1216; --dd-surface:#101a1f; --dd-surface-2:#18242b; --dd-surface-3:#1f2d35;
  --dd-hover:#131f25; --dd-hover-2:#1b272e; --dd-border:#2c3d46; --dd-border-soft:#1c2a31;
  --dd-text:#e8f0f2; --dd-text-2:#c9d8dd; --dd-text-3:#a3b5bc; --dd-muted:#8fa3ab; --dd-muted-2:#7d9199; --dd-disabled:#5b6d76;
  --dd-teal-100:#eefbf9; --dd-teal-200:#d3f5f1; --dd-teal-300:#a9ebe4; --dd-teal-400:#6fdad0; --dd-teal-500:#3fc2b7;
  --dd-teal-600:#2f9f96; --dd-teal-700:#257c75; --dd-teal-800:#1d5b56; --dd-teal-900:#12312f; --dd-accent:#3fc2b7;
  --dd-amber-300:#f6d494; --dd-amber-400:#f3c063; --dd-amber-500:#f0ad3e; --dd-amber-700:#9c6d21;
  --dd-nav:#b6c6cc;
  --dd-header-h:68px; --dd-page-max:1240px;
  --dd-ease:cubic-bezier(.4,0,.2,1);
  --dd-amber-100:#fdf5e6; --dd-amber-200:#fae7c2; --dd-amber-600:#c88c2c; --dd-amber-800:#714f18; --dd-amber-900:#432f10;
  --dd-font-sans:"Inter",system-ui,sans-serif; --dd-font-arabic:"Noto Kufi Arabic","Inter",sans-serif; --dd-font-mono:"JetBrains Mono",ui-monospace,monospace;
  --dd-ok-bg:#12312f; --dd-ok-fg:#a9ebe4; --dd-ok-bd:#1d5b56;
  --dd-warn-bg:#432f10; --dd-warn-fg:#f6d494; --dd-warn-bd:#714f18;
  --dd-error-bg:#3d1b1e; --dd-error-fg:#f3b5b8; --dd-error-bd:#6b2f34;
  --dd-info-bg:#152834; --dd-info-fg:#9cc9e8; --dd-info-bd:#27455a;
  --dd-mute-bg:#1f2d35; --dd-mute-fg:#a3b5bc; --dd-mute-bd:#2c3d46;
  --dd-elev-1:0 0 0 1px var(--dd-border); --dd-elev-2:0 20px 50px rgba(0,0,0,.45); --dd-elev-3:0 24px 60px rgba(0,0,0,.6);
}

*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--dd-bg); color:var(--dd-text); font-family:"Inter",system-ui,sans-serif; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
html[dir="rtl"] body { font-family:"Noto Kufi Arabic","Inter",sans-serif; }
a { color:var(--dd-teal-400); text-decoration:none; }
a:hover { color:var(--dd-teal-300); }
img,svg { max-width:100%; }
*:focus-visible { outline:2px solid var(--dd-accent); outline-offset:2px; }
::selection { background:var(--dd-teal-800); color:var(--dd-text); }
summary::-webkit-details-marker { display:none; }
summary { list-style:none; cursor:pointer; }
input,textarea,select { font-family:inherit; width:100%; min-width:0; }
h1,h2,h3,h4 { margin:0; }

@keyframes ddflow  { to { stroke-dashoffset:-120; } }
@keyframes ddpulse { 0%,100% { opacity:.3; r:3; } 50% { opacity:1; r:5; } }
@keyframes ddfloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-8px); } }
@keyframes ddbar   { from { transform:scaleX(0); } to { transform:scaleX(1); } }

/* ── Layout ─────────────────────────────────────────────── */
.dd-wrap { max-width:var(--dd-page-max); margin-inline:auto; width:100%; }

/* ── Header ─────────────────────────────────────────────── */
.dd-nav { display:flex; }
.dd-menu-btn { display:none; }
.dd-login { display:inline-flex; }
.hv-nav:hover { color:var(--dd-text); }
.hv-outline:hover { background:var(--dd-teal-900); color:var(--dd-teal-300); }
.hv-ghost:hover { border-color:var(--dd-muted); color:var(--dd-text); }
.hv-chipbtn:hover { border-color:var(--dd-teal-500); color:var(--dd-text); }
.hv-login:hover { background:var(--dd-surface-2); color:var(--dd-text); }
.hv-card { transition:border-color .15s var(--dd-ease), transform .15s var(--dd-ease); }
.hv-card:hover { border-color:var(--dd-teal-500)!important; transform:translateY(-2px); }
.hv-row { transition:background .12s var(--dd-ease); }
.hv-row:hover { background:var(--dd-hover); }
.hv-summary:hover { color:var(--dd-teal-300); }
.hv-footlink:hover { color:var(--dd-teal-400); }
.dd-input:focus { border-color:var(--dd-teal-500)!important; }

/* Mobile drawer */
.dd-mobile-nav { display:none; }
.dd-mobile-nav[data-open] { display:flex; }

/* ── Responsive grids ───────────────────────────────────── */
.dd-hero-grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:64px; align-items:center; }
.dd-grid-4 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px; }
.dd-grid-3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.dd-how-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.dd-docs-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:56px; align-items:center; }
.dd-trust-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:56px; align-items:center; }
.dd-trust-cards { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px; }
.dd-faq-grid { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:56px; align-items:start; }
.dd-contact-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:start; }
.dd-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.dd-footer-grid { display:grid; grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr)); gap:40px; }
.dd-status-scroll { overflow-x:auto; }
.dd-status-grid { display:grid; grid-template-columns:1.6fr .8fr 1.4fr .8fr .9fr; gap:16px; align-items:center; }

@media (max-width:1080px){
  .dd-nav { display:none; }
  .dd-menu-btn { display:grid; }
  .dd-login { display:none; }
}
@media (max-width:980px){
  .dd-hero-grid { grid-template-columns:1fr; gap:40px; }
  .dd-docs-grid, .dd-trust-grid, .dd-contact-grid, .dd-faq-grid { grid-template-columns:1fr; gap:36px; }
  .dd-grid-4 { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
  .dd-how-grid { grid-template-columns:1fr; }
}
@media (max-width:860px){
  .dd-grid-3 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dd-footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
}
@media (max-width:620px){
  .dd-grid-3 { grid-template-columns:1fr; }
  .dd-grid-4 { grid-template-columns:1fr 1fr; }
  .dd-form-grid { grid-template-columns:1fr; }
  .dd-footer-grid { grid-template-columns:1fr; }
  .dd-status-grid { min-width:640px; }
  .dd-h1 { font-size:42px!important; }
  .dd-h2 { font-size:30px!important; }
  .dd-sec { padding-left:20px!important; padding-right:20px!important; }
}

/* full-width status table gets a min width so it scrolls rather than crushes */
@media (max-width:760px){ .dd-status-grid { min-width:660px; } }

/* ── Reduced motion ─────────────────────────────────────── */
@media (prefers-reduced-motion: reduce){
  html { scroll-behavior:auto; }
  [style*="ddflow"], [style*="ddpulse"], [style*="ddfloat"], [style*="ddbar"] { animation:none !important; }
}
