/* Dalbit's supplied brand and five nature motifs. */
/* Desktop offsets include the owner's additional 10/5/5 mm adjustment. */
@media(min-width:681px){
 .header>.brand{position:relative;left:15mm}
 .welcome-copy{position:relative;left:10mm}
 .welcome-art.moon-scene{left:-10mm}
 .header>nav{left:-5mm}
 .header>nav{position:relative}
}
.header{min-height:104px;height:auto;padding-top:6px;padding-bottom:6px}
.header .brand{display:block;line-height:0}
.header .brand-logo{display:block;width:172px;height:auto;border-radius:4px}
.welcome-inner{grid-template-columns:1.12fr .88fr;gap:72px;padding-top:42px;padding-bottom:42px}
.welcome{background:radial-gradient(ellipse at 82% 38%,#ece6d6 0%,transparent 54%),linear-gradient(120deg,#faf7ef,#f5f3e9)}
.welcome h1{font-size:clamp(31px,3vw,44px)}
.welcome-elements{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;max-width:490px;margin:30px 0}
.element-tile{--ink:#59765c;--wash:#e6ecdf;position:relative;padding:17px 7px 13px;text-align:center;border:1px solid #dcd6c7;border-radius:26px 26px 7px 7px;background:radial-gradient(ellipse at 50% 14%,var(--wash),#fcfaf5 76%);box-shadow:0 3px 7px #65533206;transition:transform .4s ease,box-shadow .4s ease}
.element-tile:after{content:'';position:absolute;bottom:0;left:26%;right:26%;height:2px;background:var(--ink);opacity:.55}
.element-tile:hover{transform:translateY(-4px);box-shadow:0 9px 18px #65533210}
.element-tile svg{display:block;width:46px;height:46px;margin:0 auto 9px;fill:none;stroke:var(--ink);stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}
.element-tile-name{font:23px/1.4 Dalbit;color:var(--ink)}
.element-tile-name small{font:13px Dalbit;margin-left:6px;opacity:.65}
.element-tile>span{display:block;white-space:nowrap;font-size:13px;letter-spacing:1px;color:#6e7468;margin-top:6px}
.element-tile.fire{--ink:#a66d45;--wash:#f2e4ce}.element-tile.earth{--ink:#96783c;--wash:#eee4c9}.element-tile.metal{--ink:#667a7b;--wash:#e4e9e5}.element-tile.water{--ink:#547a92;--wash:#e0eaf0}
.welcome-art.moon-scene{position:relative;justify-self:end;width:min(70%,269.5px);margin:0;padding:10px;border:1px solid #c6b48b;border-radius:190px 190px 20px 20px;box-shadow:0 20px 60px #203b3920;background:#f8f4e9;isolation:isolate}
.scene-viewport{position:relative;overflow:hidden;aspect-ratio:941/1470;border-radius:inherit;background:#233e4b;transform:translateZ(0)}
.scene-landscape{position:absolute;inset:-1%;transform:none}
.welcome-art .scene-landscape img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;border-radius:0}
.welcome-art.moon-scene figcaption{position:static;transform:none;white-space:normal;box-shadow:none;border:0;border-radius:0;background:transparent;text-align:center;padding:16px 5px 5px;color:#5c655c;font-size:13px;line-height:1.6}
.moon-scene figcaption span{display:block;font:17px/1.5 Dalbit;color:#6b5532;margin-bottom:3px}
.moon-scene.scene-paused *{animation-play-state:paused!important}
@media(max-width:1000px){.welcome-inner{gap:35px}.element-tile{padding:14px 3px 11px}.element-tile svg{width:38px;height:38px}.element-tile>span{font-size:12px}.welcome-art.moon-scene{width:min(70%,245px)}}
@media(max-width:680px){
 .header{padding:8px 20px 13px;gap:8px}.header .brand-logo{width:145px}.header nav{margin-left:auto;gap:14px}.header nav .nav-shop{display:none}
 .welcome-inner{display:flex;gap:26px;padding:26px 0 34px}.welcome-copy{order:0}.welcome-art.moon-scene{order:1;width:min(58.8%,217px);align-self:center;border-radius:160px 160px 17px 17px;padding:8px}
 .welcome h1{font-size:29px}.welcome-elements{gap:7px;margin:24px 0}.element-tile{padding:13px 3px 12px;border-radius:22px 22px 6px 6px}.element-tile svg{width:36px;height:36px;margin-bottom:8px}.element-tile-name{font-size:21px}.element-tile-name small{font-size:11px;margin-left:4px}.element-tile>span{font-size:12px;letter-spacing:0}
 .welcome-art.moon-scene figcaption{font-size:12px;padding-top:12px}.moon-scene figcaption span{font-size:16px}
}
@media(prefers-reduced-motion:reduce){.moon-scene *{animation:none!important}.scene-petals{display:none}.element-tile{transition:none}.element-tile:hover{transform:none}}

/* Larger reading and store information, requested for comfortable reading. */
.reading-links button>span{font-size:26px}
.reading-links h3{font-size:27.6px;line-height:1.5}
.reading-links p{font-size:15.4px;line-height:1.8;color:#697464}
#store-link .button{font-size:21px;padding:24px 37.5px;gap:52.5px;max-width:100%;word-break:keep-all}
#store-link .button span{flex-shrink:0}
footer .brand{display:block;width:220px;line-height:0}
footer .brand-logo{display:block;width:220px;height:auto;border-radius:4px}
footer>p{font-size:15.4px}
footer>div{font-size:20px;flex-wrap:wrap;align-items:center}
footer>small{font-size:20px}
@media(max-width:1000px) and (min-width:681px){.reading-links{gap:24px;grid-template-columns:1fr}.reading-links button{padding:24px 0}.reading-links h3{margin:12px 0}}
@media(max-width:680px){.reading-links h3{font-size:26.4px}#store-link .button{gap:20px;padding-left:25px;padding-right:25px;text-align:left}footer>div{gap:16px 24px}}

/* Transparent emblem with the original Dalbit typeface; no rectangular plaque. */
.header .brand,footer .brand{display:flex;align-items:center;gap:12px;width:auto;line-height:1.3}
.header .brand-logo,footer .brand-logo{display:block;width:70px;height:54px;object-fit:contain;border-radius:0}
.brand-name{font:30px/1.3 Dalbit,serif;white-space:nowrap;letter-spacing:-1px}
footer .brand-name{font-size:34px;color:#ead2a1}
footer .brand-logo{width:80px;height:62px}
.scene-petals{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.scene-petals i{position:absolute;left:var(--x);top:-5%;width:8px;height:12px;border-radius:80% 15% 75% 35%;background:linear-gradient(135deg,#fff8eb,#ead0c7);opacity:0;animation:petal-fall var(--duration) linear infinite;animation-delay:var(--delay);will-change:transform}
.scene-petals i:nth-child(1){--x:82%;--duration:22s;--delay:-3s}
.scene-petals i:nth-child(2){--x:65%;--duration:26s;--delay:-15s;width:6px;height:9px}
.scene-petals i:nth-child(3){--x:94%;--duration:24s;--delay:-8s}
.scene-petals i:nth-child(4){--x:48%;--duration:28s;--delay:-21s;width:5px;height:8px}
.scene-petals i:nth-child(5){--x:73%;--duration:25s;--delay:-19s;width:7px;height:10px}
.scene-petals i:nth-child(6){--x:32%;--duration:30s;--delay:-10s;width:5px;height:7px}
.scene-petals i:nth-child(7){--x:57%;--duration:27s;--delay:-25s;width:6px;height:9px}
@keyframes petal-fall{0%{transform:translate(0,-15px) rotate(0deg);opacity:0}12%{opacity:.65}35%{transform:translate(-25px,190px) rotate(80deg)}65%{transform:translate(-16px,370px) rotate(170deg);opacity:.55}90%{opacity:.35}100%{transform:translate(-65px,660px) rotate(260deg);opacity:0}}
@media(max-width:680px){.header .brand{gap:8px}.header .brand-logo{width:52px;height:42px}.header .brand-name{font-size:25px}.header{min-height:80px}}

/* 2026-11-04 requested copy and relative type-size refinement. */
#experience .text-link{font-size:16.8px}
.shop-section>p:not(.eyebrow){font-size:18.2px}
footer>div button{font-size:10px}
@media(max-width:680px){.shop-section>p:not(.eyebrow){font-size:16.9px}}

/* 2026-11-05: one brand at left, supporting sentence below, links at right. */
footer{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:28px}
footer .footer-identity{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.footer-identity p{font-size:15.4px;line-height:1.8;text-align:left}
.footer-links{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:24px;font-size:20px}
.footer-links button{font-size:10px}
footer .footer-contact{font-size:14px;color:#ead2a1}
footer .footer-copyright{grid-column:1/-1;margin:0;padding:14px 18px;border:1px solid #738c864d;border-radius:6px;color:#bbc9c4;font-size:12px;line-height:1.8;text-align:left;word-break:keep-all;overflow-wrap:anywhere}
@media(max-width:680px){footer{grid-template-columns:minmax(0,1fr);gap:26px}.footer-links{justify-self:end;gap:20px}.footer-identity p{max-width:100%}}