/* Shared design tokens. Component styles consume these values. */
:root {
  /* Palette */
  --ink: #30382b;
  --green: #495538;
  --muted: #68705f;
  --cream: #f6f3ec;
  --line: #dedfd6;
  --white: #fff;
  --surface-field: #fbfbf8;
  --surface-footer: #fafaf7;
  --border-control: #c8cdbf;
  --border-header: #eee;
  --border-summary: #d4d8cb;
  --border-steps: #d7d9cb;
  --focus: #9f713e;
  --error: #8c2929;
  --link-hover: #986b3d;
  --green-hover: #354127;
  --text-story: #50564b;
  --text-step: #7d886c;
  --on-hero: #fffdf7;
  --on-hero-muted: #f8f6ed;
  --surface-button-hover: #f0e9dc;
  --surface-cart-filled: color-mix(in srgb, var(--green) 14%, transparent);
  --surface-cart-filled-hover: color-mix(in srgb, var(--green) 22%, transparent);
  --surface-hero: #777d64;
  --surface-image-caption: #30382b80;
  --backdrop-dialog: #20251ca6;
  --notice-background: #faf4e7;
  --notice-border: #dfcda5;
  --notice-text: #6d5129;
  --placeholder-text: #79572a;
  --placeholder-background: #f5ead2;
  --callout-border: #b59c6e;
  --print-border: #888;

  /* Typography */
  --sans: Arial,Helvetica,sans-serif;
  --serif: Georgia,'Times New Roman',serif;
  --text-body: 16px;
  --text-2xs: .75rem;
  --text-xs: .8125rem;
  --text-sm: .875rem;
  --text-label: .9375rem;
  --text-base: 1rem;
  --text-lead: 1.0625rem;
  --text-lg: 1.125rem;
  --heading-sm: 1.5rem;
  --heading-md: 2rem;
  --line-height-body: 1.6;
  --line-height-control: 1.5;
  --line-height-heading: 1.2;
  --line-height-reading: 1.8;
  --weight-regular: 400;
  --weight-semibold: 600;

  /* Spacing scale (4 px steps) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;

  /* Shared layout widths */
  --page-max-width: 1240px;
  --page-inner-width: 1176px;
  --content-narrow-width: 850px;
  --page-gutter: var(--space-8);
  --page-gutter-tablet: var(--space-6);
  --page-gutter-mobile: var(--space-5);

  /* Corners */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-card-small: 10px;
  --radius-card: 12px;
  --radius-dialog: 18px;
  --radius-chip: 20px;
  --radius-tab: 24px;
  --radius-button: 30px;

  /* Forms and buttons */
  --form-control-height: 2.5rem;
  --form-control-font-size: var(--text-base);
  --form-control-line-height: var(--line-height-control);
  --form-control-padding-block: .375rem;
  --form-control-padding-inline: .75rem;
  --button-min-height: var(--form-control-height);
  --button-padding-block: var(--form-control-padding-block);
  --button-padding-inline: var(--space-4);
  --form-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23495538' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

  /* Effects */
  --duration-fast: .2s;
  --duration-normal: .3s;
  --duration-hero: 2s;
  --shadow-hero: 0 18px 70px #25291d20;
  --shadow-dialog: 0 25px 100px #0003;
  --shadow-menu: 0 12px 20px #0001;
  --hero-card-background: linear-gradient(125deg,rgba(121,148,135,.88),rgba(90,110,58,.88) 60%,rgba(126,140,130,.9));
}

*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--white);color:var(--ink);font-family:var(--sans);font-size:var(--text-body);line-height:var(--line-height-body)}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--focus);outline-offset:5px}button{color:inherit}h1,h2,h3,p{margin-top:0}h2{font-family:var(--serif);font-weight:var(--weight-regular);font-size:clamp(2rem,3.5vw,3.25rem);line-height:var(--line-height-heading);margin-bottom:var(--space-6)}.preview-note{text-align:center;font-size:var(--text-sm);padding:7px 15px;background:var(--green);color:var(--white)}.header{height:112px;display:flex;align-items:center;padding:0 5%;gap:38px;border-bottom:1px solid var(--border-header)}.wordmark{display:flex;align-items:center;flex-shrink:0}.wordmark img{display:block;width:100px;height:82px;object-fit:contain}.header nav{display:flex;gap:30px;margin-left:25px;font-size:var(--text-label)}.header nav a:hover{color:var(--link-hover)}.header-contact{margin-left:auto;background:none;border:0;font-size:var(--text-label)}.header-contact span{font-size:1.7rem;vertical-align:middle;margin-left:var(--space-3)}.icon-button{border:0;background:none;display:grid;place-items:center}.menu-toggle{display:none;width:40px;padding:6px;gap:5px}.menu-toggle span{height:2px;width:25px;background:var(--ink)}.hero{margin:var(--space-6);min-height:600px;position:relative;display:flex;align-items:center;justify-content:center;padding:var(--space-12) var(--space-5);background:var(--surface-hero) url('assets/hero.png') center/cover}.hero-card{width:550px;max-width:100%;text-align:center;padding:44px var(--space-10) 35px;border-radius:38px;background:var(--hero-card-background);backdrop-filter:blur(14px);color:var(--on-hero);box-shadow:var(--shadow-hero);animation:appear var(--duration-hero) ease-out both}.eyebrow{text-transform:uppercase;font-size:var(--text-sm);letter-spacing:2.3px;font-weight:var(--weight-semibold);line-height:var(--line-height-control);margin-bottom:22px}.hero-card .eyebrow{font-size:var(--text-xs);letter-spacing:2px;color:var(--on-hero-muted)}.hero h1{font-family:var(--serif);font-size:clamp(2.25rem,4.2vw,3.6rem);font-weight:var(--weight-regular);line-height:1.15;margin-bottom:22px}.hero h1 em{display:block;font-size:clamp(4.1rem,7.3vw,6.6rem);font-weight:var(--weight-regular);margin-top:var(--space-2);letter-spacing:-3px}.hero-description{font-size:var(--text-lead);line-height:1.65;margin-bottom:var(--space-6)}.button{display:inline-flex;align-items:center;justify-content:center;padding:var(--button-padding-block) var(--button-padding-inline);border-radius:var(--radius-button);font-size:var(--text-sm);font-weight:var(--weight-semibold);line-height:var(--form-control-line-height);min-height:var(--button-min-height);border:1px solid transparent;transition:background var(--duration-fast),transform var(--duration-fast)}.button:hover{transform:translateY(-2px)}.button-light{background:var(--on-hero);color:var(--ink)}.button-light:hover{background:var(--surface-button-hover)}.button-dark{background:var(--green);color:var(--white)}.button-dark:hover{background:var(--green-hover)}.hero-link{display:block;margin:18px auto 0;border:0;background:none;color:var(--on-hero);font-size:.8755rem;text-decoration:underline;text-underline-offset:4px;padding:var(--space-1)}.image-note{position:absolute;bottom:var(--space-3);right:var(--space-4);font-size:var(--text-xs);padding:3px 9px;color:var(--white);background:var(--surface-image-caption);border-radius:3px}.section{max-width:var(--page-max-width);margin:0 auto;padding:88px var(--page-gutter)}.collections{text-align:center}.collections h2{color:var(--green)}.collections .eyebrow{color:var(--muted);margin-bottom:13px}.collection-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-6);margin-top:var(--space-10)}.collection{padding:0;background:none;border:0;text-align:left;min-width:0}.collection-photo{display:block;width:100%;aspect-ratio:1;background-image:url('assets/collections.png');background-size:200% 200%;background-color:var(--cream);border-radius:var(--radius-xs);transition:filter var(--duration-normal)}.collection:hover .collection-photo{filter:brightness(.93)}.photo-puzzles{background-position:0 0}.photo-animals{background-position:100% 0}.photo-decor{background-position:0 100%}.photo-frames{background-position:100% 100%}.collection-label{display:block;font-family:var(--serif);font-size:1.35rem;line-height:1.25;margin-top:19px}.collection-label span{display:block;font-family:Arial,sans-serif;font-size:var(--text-sm);margin-top:9px;color:var(--muted)}.section-note{font-size:var(--text-sm);color:var(--muted);margin:30px 0 0}.personalization{background:var(--cream);max-width:none;display:grid;grid-template-columns:1fr 1fr;gap:100px;padding-left:max(var(--space-8),calc((100vw - var(--page-inner-width))/2));padding-right:max(var(--space-8),calc((100vw - var(--page-inner-width))/2))}.personalization-intro>p:not(.eyebrow){max-width:500px;color:var(--muted);margin-bottom:var(--space-7)}.steps{list-style:none;margin:0;padding:0}.steps li{display:flex;gap:23px;padding:22px 0;border-bottom:1px solid var(--border-steps)}.steps li:first-child{padding-top:0}.step-number{font-family:var(--serif);font-size:var(--heading-sm);color:var(--text-step)}.steps h3{font-size:var(--text-lead);font-weight:var(--weight-semibold);margin-bottom:7px}.steps p{font-size:var(--text-label);color:var(--muted);margin-bottom:0}.atelier{text-align:center;max-width:var(--content-narrow-width)}.atelier>p:not(.eyebrow){color:var(--muted);max-width:640px;margin:0 auto 25px}.text-link{font-size:var(--text-label);border-bottom:1px solid var(--green);padding-bottom:var(--space-1)}footer{border-top:1px solid var(--line);padding:var(--space-10) 30px;text-align:center;background:var(--surface-footer)}footer .footer-logo{font-family:var(--serif);font-style:italic;font-size:var(--heading-md)}footer p{font-size:var(--text-label);color:var(--muted);margin:var(--space-3) 0}footer button{border:0;background:none;text-decoration:underline;text-underline-offset:4px;font-size:var(--text-label)}footer small{display:block;font-size:var(--text-xs);color:var(--muted);margin-top:var(--space-6)}dialog{width:min(650px,calc(100% - 32px));max-height:90dvh;border:0;border-radius:var(--radius-dialog);padding:var(--space-10);color:var(--ink);box-shadow:var(--shadow-dialog)}dialog::backdrop{background:var(--backdrop-dialog);backdrop-filter:blur(4px)}dialog h2{font-size:2.2rem;margin-bottom:15px}.close-dialog{position:absolute;right:var(--space-3);top:10px;width:40px;height:40px;font-size:var(--heading-md)}.dialog-intro{font-size:var(--text-label);color:var(--muted)}label{display:block;font-size:var(--text-label);margin:17px 0}.optional{color:var(--muted);font-size:var(--text-sm)}/* Common form controls. Height and typography are configured once in :root. */
input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]):not([data-quantity-input]),select,textarea{display:block;width:100%;margin-top:7px;background:var(--surface-field);border:1px solid var(--border-control);border-radius:var(--radius-sm);padding:var(--form-control-padding-block) var(--form-control-padding-inline);color:var(--ink);font-size:var(--form-control-font-size);line-height:var(--form-control-line-height)}
input:not([data-quantity-input]):not([type="radio"]):not([type="checkbox"]):not([type="file"]):not([type="hidden"]):not([type="range"]):not([type="color"]):not([type="image"]):not([type="button"]):not([type="submit"]):not([type="reset"]),select:not([multiple]):not([size]),select:not([multiple])[size="1"]{height:var(--form-control-height)}
select:not([multiple]):not([size]),select:not([multiple])[size="1"]{appearance:none;-webkit-appearance:none;padding-right:2.5rem;background-image:var(--form-select-arrow);background-repeat:no-repeat;background-position:right .75rem center;background-size:1rem}
@media(forced-colors:active){select:not([multiple]){appearance:auto;-webkit-appearance:auto;background-image:none}}
textarea{resize:vertical;min-height:110px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.form-note{font-size:var(--text-sm);color:var(--muted);background:var(--cream);padding:13px;border-radius:var(--radius-sm)}.collection-detail-photo{aspect-ratio:1.5;background:url('assets/collections.png') 0 0/200% 200%;border-radius:var(--radius-md);margin:10px 0 25px}dl{background:var(--cream);padding:var(--space-5);border-radius:var(--radius-md)}dt{font-size:var(--text-sm);color:var(--muted);margin-top:var(--space-3)}dt:first-child{margin-top:0}dd{margin:3px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}body.modal-open{overflow:hidden}[hidden]{display:none!important}@keyframes appear{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@media(max-width:850px){.header{padding:0 var(--space-6);gap:var(--space-5);height:95px}.header nav{gap:18px;margin-left:0}.header-contact{font-size:var(--text-sm)}.personalization{gap:var(--space-10)}.collection-grid{gap:18px}.section{padding:var(--space-16) var(--page-gutter-tablet)}.collection-label{font-size:1.2rem}}@media(max-width:640px){html{scroll-padding-top:20px}.preview-note{font-size:var(--text-2xs)}.header{height:85px;position:relative;justify-content:space-between;padding:0 18px}.menu-toggle{display:grid}.wordmark img{width:78px;height:64px}.header-contact{margin:0;font-size:0;width:40px;padding:0}.header-contact span{font-size:1.8rem;margin:0}.header nav{display:none;position:absolute;top:85px;left:0;right:0;background:var(--white);z-index:5;box-shadow:var(--shadow-menu);padding:22px}.header nav.is-open{display:flex;flex-direction:column}.hero{margin:var(--space-3);min-height:520px;padding:35px 14px}.hero-card{padding:var(--space-8) 22px;border-radius:26px}.hero h1{font-size:2.3rem}.hero h1 em{font-size:4.6rem;letter-spacing:-2px}.hero-card .eyebrow{font-size:var(--text-2xs);letter-spacing:1.5px}.hero-description{font-size:var(--text-base)}.collection-grid{grid-template-columns:repeat(2,1fr);gap:27px 17px;margin-top:30px}.section{padding:54px var(--page-gutter-mobile)}.personalization{grid-template-columns:1fr;gap:var(--space-10)}.atelier h2{font-size:var(--heading-md)}.form-row{grid-template-columns:1fr;gap:0}.form-row label{margin:10px 0}dialog{padding:35px 22px}dialog h2{font-size:1.85rem}.collection-detail-photo{aspect-ratio:1}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-card{animation:none}.button,.collection-photo{transition:none}}

.footer-legal{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--space-3) 26px;margin:25px auto 15px;font-size:var(--text-sm)}.footer-legal a{text-decoration:underline;text-underline-offset:4px}.form-note a{text-decoration:underline;text-underline-offset:3px}
