/* Elfantics festive visual identity — layered over the existing responsive layout */
:root{--pine:#103e34;--fir:#175344;--cranberry:#a6293a;--gold:#e8bb64;--snow:#fffaf1}
body{background:#fffaf1;color:var(--pine)}
header{background:var(--pine);color:#fff8e7;border-bottom:3px solid var(--gold);box-shadow:0 4px 20px #103e3430;position:relative;z-index:2}
.logo{color:var(--gold);font-size:clamp(24px,3vw,31px);text-shadow:0 2px 12px #e8bb6455}
nav a:not(.nav-cta){color:#fff6df}
nav a:hover{text-decoration:underline;text-underline-offset:5px}
.nav-cta{background:var(--cranberry);border:1px solid #e4b76c}
.hero{position:relative;isolation:isolate;background:radial-gradient(circle at 12% 14%,#e8bb6455 0 2px,transparent 3px),radial-gradient(circle at 75% 24%,#fff 0 2px,transparent 3px),linear-gradient(125deg,#123c35 0%,#1b5a4a 54%,#12372e 100%);background-size:140px 120px,190px 150px,auto;color:#fffaf0;overflow:hidden}
.hero:before{content:none}
.hero:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 85% 60%,#e8bb6420,transparent 45%)}
.hero .eyebrow{color:var(--gold)}
.hero h1{color:#fffdf4;text-shadow:0 3px 18px #082a2499}
.hero h1 em{color:#f3c875}
.hero p,.hero small{color:#f0e9d9}
.primary{background:var(--cranberry);color:white;box-shadow:0 5px 0 #641c2a}
.primary:hover,.nav-cta:hover{background:#c3364a}
.secondary{color:#fffaf0;border:1px solid #f3d7a2}
.hero-media img{border:5px solid #f7e7c6;box-shadow:13px 13px 0 #b28c4d,0 18px 50px #06271f99}
.media-tag{background:#fff5dc;color:#653d18;border:1px solid var(--gold)}
.section .eyebrow{color:#a02f3d}
.section h2{color:var(--pine)}
.ideas{background:linear-gradient(180deg,#f6ead3 0%,#fff9ef 160px,#f5f0e5 100%);border-top:6px solid var(--gold);border-bottom:6px solid var(--gold)}
.ideas:before{content:none}
.idea-controls{background:#fffdf8;border:1px solid #e3cfa9;padding:18px;border-radius:18px;box-shadow:0 9px 30px #392b1712}
.idea-controls input:focus,.idea-controls select:focus{outline:3px solid #e8bb64;outline-offset:2px}
.idea-card{border:1px solid #dfcfb2;border-radius:18px;box-shadow:0 7px 20px #2b302013;overflow:hidden}
.idea-card:hover{box-shadow:0 12px 32px #173d3327}
.idea-card h3{color:#174c3f}
.idea-icon{width:100%;padding:0;min-height:170px;background:#efe5d5}
.idea-icon img{height:190px}
.idea-icon.photo-pending{min-height:190px;background:repeating-linear-gradient(135deg,#f0e6d6,#f0e6d6 14px,#f8f1e5 14px,#f8f1e5 28px);color:#6b5947}
.idea-tags span{background:#e9f1e9;color:#235142}
.magic-label{background:#fff0c6;color:#855510}
#resultCount{font-weight:800!important;color:#174c3f!important}
.studio{background:#fffaf1}
.studio-panel{border:2px solid #e5c688;box-shadow:0 14px 35px #3a2a1814}
footer{background:#103e34;border-top:5px solid var(--gold)}
@media(max-width:760px){header{gap:12px}nav{flex-wrap:wrap}.hero:before{font-size:16px;letter-spacing:1vw}.hero{padding-top:58px}.idea-controls{padding:12px}.ideas:before{letter-spacing:.5rem;margin-top:-22px}.hero-media img{box-shadow:7px 7px 0 #b28c4d}}
@media(prefers-reduced-motion:no-preference){.idea-card,.primary{transition:box-shadow .2s ease,transform .2s ease}.idea-card:hover{transform:translateY(-3px)}}

/* Image-first gallery with accessible full instructions in a modal. */
.ideas .cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:18px;align-items:stretch}
.idea-card-compact{display:block;width:100%;padding:0 0 14px;text-align:left;background:#fffdf8;color:var(--pine);font:inherit;cursor:pointer;appearance:none}
.idea-card-compact .idea-icon{min-height:0;height:auto;aspect-ratio:4/3;overflow:hidden;border-radius:0}
.idea-card-compact .idea-icon img{display:block;width:100%;height:100%;object-fit:cover}
.idea-card-compact .idea-icon.photo-pending{min-height:0;display:grid;place-items:center;text-align:center;padding:12px}
.idea-card-compact h3{font-size:1rem;line-height:1.35;margin:12px 14px 0}
.idea-card-compact:focus-visible,.idea-dialog-close:focus-visible{outline:3px solid var(--cranberry);outline-offset:3px}
.idea-dialog{width:min(680px,calc(100% - 28px));max-height:min(90vh,900px);padding:0;border:1px solid #d9c6a2;border-radius:20px;background:#fffdf8;color:var(--pine);box-shadow:0 24px 90px #102d2870;overflow:auto}
.idea-dialog::backdrop{background:#0d2824b8}
.idea-dialog-close{position:sticky;top:12px;float:right;margin:12px 14px -50px 0;z-index:1;padding:10px 14px;border-radius:24px;border:1px solid #e2cfae;background:#fffaf0;color:var(--pine);font:inherit;font-weight:700;cursor:pointer}
.idea-dialog-body{padding:22px 28px 30px}
.idea-dialog-body .idea-icon{max-height:300px;overflow:hidden;border-radius:14px}
.idea-dialog-body .idea-icon img{display:block;width:100%;height:300px;object-fit:cover}
.idea-dialog-body h2{font-size:clamp(1.5rem,4vw,2rem);margin:20px 0 8px}
.idea-dialog-body h3{margin:20px 0 8px}
.idea-dialog-body li{margin-bottom:8px;line-height:1.55}
.idea-dialog-body .idea-care{margin:18px 0;padding:16px;border-radius:12px;background:#f3f0e9}
.idea-dialog-body .idea-care p{margin:0 0 10px}
@media(max-width:600px){.ideas .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.idea-card-compact h3{font-size:.92rem;margin:10px 10px 0}.idea-dialog-body{padding:16px}}

/* Christmas atmosphere across every section, not only the hero. */
body{background:#fff9ed}
.section:not(.hero){position:relative}
#examples{background:radial-gradient(circle at 94% 9%,#f5d99b70,transparent 27%),linear-gradient(160deg,#fffaf0,#f7e8d0);border-top:4px solid #d8ad65}
#examples .media-card{background:#fffdf8;border:1px solid #e3cca2;border-radius:18px;box-shadow:0 10px 26px #402c1815;overflow:hidden}
#examples .section-heading:after{content:none}
.ideas{background:radial-gradient(circle at 8% 24%,#f5e3bc,transparent 34%),linear-gradient(180deg,#fff9ef,#f5e9d6 60%,#fffaf0)}
.idea-controls{border-top:4px solid #b13d4c}
.filter-footer{border-bottom:1px solid #e4d1ae;padding-bottom:18px;margin-bottom:22px}
.studio{background:radial-gradient(circle at 90% 12%,#e8bb6424,transparent 38%),linear-gradient(145deg,#113f35,#1a5948);color:#fff8e9;border-top:5px solid #e8bb64;border-bottom:5px solid #e8bb64}
.studio h2,.studio .eyebrow,.studio-copy h2{color:#f5d392}
.studio p,.studio li,.studio label{color:#fff5e5}
.studio-panel{background:#fffdf8;color:#153e33}
.studio-panel label,.studio-panel p{color:#153e33}
.studio-panel .upload{border:2px dashed #d5ad65;background:#fff8e9}
.pricing{background:radial-gradient(circle at 5% 85%,#d9b66e2b,transparent 30%),linear-gradient(180deg,#fff8e9,#f5e7cf);border-bottom:5px solid #d9b46b}
.pricing .price{background:#fffdf8;border:1px solid #dec69e;box-shadow:0 8px 25px #48341c15}
.pricing .price.featured{border:3px solid #b13d4c}
footer{background:linear-gradient(135deg,#0e352d,#194e3f);color:#fff6df}
footer:before{content:none}

@keyframes elfantics-snowfall{from{transform:translate3d(0,-45vh,0)}to{transform:translate3d(35px,55vh,0)}}

@media(max-width:600px){.studio{padding-top:45px;padding-bottom:45px}}

/* Christmas magic v3: saturated festive colours and clearly visible snowfall. */
:root{--pine:#083c2c;--fir:#07533b;--cranberry:#b20d2a;--gold:#f1c454;--snow:#fff6dc}
body{background:#083c2c}
header{background:linear-gradient(90deg,#052f23,#07553b);border-bottom:5px solid #f1c454}
.logo{color:#ffe49a}
.hero{background:radial-gradient(ellipse at 78% 20%,#b20d2a88,transparent 43%),linear-gradient(135deg,#063e2d 0%,#086c49 55%,#052e25 100%);border-bottom:8px solid #f1c454}
.hero h1 em{color:#ffe18b}
.hero-media img{border-color:#f7d56c;box-shadow:12px 12px 0 #a30c28,0 20px 55px #001f17aa}
#examples{background:radial-gradient(ellipse at 90% 10%,#d72b4866,transparent 40%),linear-gradient(125deg,#85152b,#b51e39 55%,#751327);border-top:7px solid #f1c454;border-bottom:7px solid #f1c454;color:#fff8e8}
#examples h2,#examples .eyebrow,#examples p,#examples .note{color:#fff5dc}
#examples .media-card{border:4px solid #f1c454;background:#fff6dc;color:#073d2d;box-shadow:0 15px 35px #35051255}
.ideas{background:radial-gradient(ellipse at 100% 0%,#176c4e,transparent 42%),linear-gradient(160deg,#084631,#0a6746 60%,#053b2c);border-top:7px solid #f1c454;border-bottom:7px solid #f1c454;color:#fff8e8}
.ideas h2,.ideas>.eyebrow,.ideas>p{color:#fff5db}
.ideas .idea-controls{background:#fff5d9;border:3px solid #f1c454;box-shadow:0 12px 35px #002b2055}
.ideas .filter-footer{color:#fff9e9;border-color:#f1c454}
.ideas .filter-footer label,.ideas #resultCount{color:#fff7dd!important}
.idea-card-compact{background:#fff7e5;border:3px solid #e3b94f;box-shadow:0 8px 22px #00271d66}
.idea-card-compact:hover{border-color:#fff1a8;box-shadow:0 14px 35px #001f1688}
.idea-card-compact h3{color:#083f2e}
.studio{background:radial-gradient(ellipse at 95% 15%,#eec45830,transparent 40%),linear-gradient(130deg,#870e28,#bd1938 60%,#730c24);border-top:7px solid #f1c454;border-bottom:7px solid #f1c454}
.studio h2,.studio .eyebrow,.studio-copy h2{color:#ffe39a}
.studio-panel{border:4px solid #f1c454;box-shadow:0 15px 40px #36071a77}
.pricing{background:radial-gradient(ellipse at 5% 90%,#b41a38 0%,transparent 40%),linear-gradient(145deg,#083d2d,#075d40);color:#fff8e7;border-bottom:7px solid #f1c454}
.pricing h2,.pricing .eyebrow{color:#ffe39a}
.pricing .price{background:#fff5db;border:3px solid #f1c454;box-shadow:0 12px 28px #00271e66;color:#0c3c2c}
.pricing .price.featured{border:5px solid #cf2441}
footer{background:linear-gradient(120deg,#650e22,#a91632);border-top:7px solid #f1c454;color:#fff7df}
footer strong{color:#ffe39a}
/* Two staggered snow layers, larger flakes with subtle dark edging for contrast. */
body:before,body:after{content:"";position:fixed;inset:-100vh 0 0;pointer-events:none;z-index:30;background-repeat:repeat;will-change:transform}
body:before{opacity:.88;background-image:radial-gradient(circle,#fff 0 4px,#e6f5ff 4.5px,transparent 6px),radial-gradient(circle,#fff 0 3px,#e5f2ff 3.5px,transparent 5px);background-size:179px 211px,263px 281px;background-position:20px 10px,110px 90px;filter:drop-shadow(0 1px 1px #173d40a0);animation:elfantics-snowfall 19s linear infinite}
body:after{opacity:.75;background-image:radial-gradient(circle,#fff 0 2.5px,#e5f2ff 3px,transparent 4px),radial-gradient(circle,#fff 0 3.5px,#e5f2ff 4px,transparent 5px);background-size:113px 163px,239px 257px;background-position:45px 25px,90px 120px;filter:drop-shadow(0 1px 1px #173d4080);animation:elfantics-snowfall 29s linear infinite -12s}
@keyframes elfantics-snowfall{from{transform:translate3d(0,-40vh,0)}to{transform:translate3d(30px,60vh,0)}}
@media(prefers-reduced-motion:reduce){body:before,body:after{animation:none;opacity:.14;inset:0;will-change:auto}}
@media(max-width:600px){body:before{opacity:.65;background-size:230px 265px,300px 340px}body:after{opacity:.48;background-size:165px 225px,270px 320px}#examples:before,.ideas:after,.pricing:before{font-size:30px;opacity:.5}}

/* Opt-in Christmas bells sound control. */
.christmas-sound-toggle{position:fixed;right:18px;bottom:18px;z-index:50;padding:12px 17px;border:2px solid #f1c454;border-radius:999px;background:#9c1230;color:#fff9e5;font:700 14px/1.2 system-ui,sans-serif;box-shadow:0 6px 22px #061e17aa;cursor:pointer}
.christmas-sound-toggle:hover{background:#c02240}
.christmas-sound-toggle:focus-visible{outline:3px solid #ffe9a0;outline-offset:3px}
@media(max-width:600px){.christmas-sound-toggle{right:10px;bottom:10px;padding:10px 13px;font-size:12px}}


/* Sparse, fixed-size snow crystals: each large transparent tile contains just one small flake. */
body:before{opacity:.65;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22290%22%20height%3D%22290%22%20viewBox%3D%220%200%20290%20290%22%3E%3Cg%20transform%3D%22translate(78%2088)%20scale(0.85)%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.4%22%20stroke-linecap%3D%22round%22%3E%3Cpath%20d%3D%22M0%20-10V10M-8.66%20-5L8.66%205M-8.66%205L8.66%20-5%22%2F%3E%3Cpath%20d%3D%22m-3%20-7%203%203%203-3m-6%2014%203-3%203%203M-7%20-1l4%201-1%204M7%201l-4-1%201-4M-4%20-4l4%201%201-4M4%204l-4-1-1%204%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22410%22%20height%3D%22410%22%20viewBox%3D%220%200%20410%20410%22%3E%3Cg%20transform%3D%22translate(300%20260)%20scale(0.65)%22%20fill%3D%22none%22%20stroke%3D%22%23e5f4ff%22%20stroke-width%3D%221.4%22%20stroke-linecap%3D%22round%22%3E%3Cpath%20d%3D%22M0%20-10V10M-8.66%20-5L8.66%205M-8.66%205L8.66%20-5%22%2F%3E%3Cpath%20d%3D%22m-3%20-7%203%203%203-3m-6%2014%203-3%203%203M-7%20-1l4%201-1%204M7%201l-4-1%201-4M-4%20-4l4%201%201-4M4%204l-4-1-1%204%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-size:290px 290px,410px 410px;background-position:0 0,0 0}
body:after{opacity:.55;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22360%22%20height%3D%22360%22%20viewBox%3D%220%200%20360%20360%22%3E%3Cg%20transform%3D%22translate(215%20130)%20scale(1.15)%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.4%22%20stroke-linecap%3D%22round%22%3E%3Cpath%20d%3D%22M0%20-10V10M-8.66%20-5L8.66%205M-8.66%205L8.66%20-5%22%2F%3E%3Cpath%20d%3D%22m-3%20-7%203%203%203-3m-6%2014%203-3%203%203M-7%20-1l4%201-1%204M7%201l-4-1%201-4M-4%20-4l4%201%201-4M4%204l-4-1-1%204%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"),url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22480%22%20height%3D%22480%22%20viewBox%3D%220%200%20480%20480%22%3E%3Cg%20transform%3D%22translate(120%20355)%20scale(0.75)%22%20fill%3D%22none%22%20stroke%3D%22%23eaf6ff%22%20stroke-width%3D%221.4%22%20stroke-linecap%3D%22round%22%3E%3Cpath%20d%3D%22M0%20-10V10M-8.66%20-5L8.66%205M-8.66%205L8.66%20-5%22%2F%3E%3Cpath%20d%3D%22m-3%20-7%203%203%203-3m-6%2014%203-3%203%203M-7%20-1l4%201-1%204M7%201l-4-1%201-4M-4%20-4l4%201%201-4M4%204l-4-1-1%204%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-size:360px 360px,480px 480px;background-position:0 0,0 0}
@media(max-width:600px){body:before{opacity:.55}body:after{opacity:.45}}

/* Storytelling around the existing real-photo/video demonstration. Snowfall unchanged. */
.story-beats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin:25px 0 28px}
.story-beats>div{padding:21px 19px;border-radius:16px;background:linear-gradient(145deg,#fff9e8,#f6e4b6);border:2px solid #d6ad4f;color:#244536;box-shadow:0 8px 20px #351c0922}
.story-beats span{display:block;color:#8d1730;font-weight:800;font-size:.75rem;letter-spacing:.09em;margin-bottom:9px}
.story-beats strong{display:block;font-size:1.1rem;line-height:1.3;color:#163f30}
.story-beats p{margin:9px 0 0;line-height:1.5;color:#385343}
.story-invite{margin:25px 0 14px;padding:24px;border:2px solid #e2b958;border-radius:17px;background:#fff8e4;color:#173d30;display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap}
.story-invite p{margin:0;flex:1 1 260px;line-height:1.6;color:#173d30}
.story-invite .button{flex-shrink:0}
.studio-coming-soon{padding:13px 16px;border-left:4px solid #f1c454;background:#fff4d8;color:#4b3322;border-radius:6px;font-weight:650}
@media(max-width:760px){.story-beats{grid-template-columns:1fr}.story-invite{padding:19px}.story-invite .button{width:100%;text-align:center}}
