@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#14284b;--green:#286ef0;--muted:#697a96;--cream:#f7f9ff;--line:#e0e7f3}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:14px 'DM Sans',sans-serif}button,input,select,textarea{font:inherit}button,a{cursor:pointer}button{color:inherit}header{height:90px;display:flex;align-items:center;gap:30px;padding:0 6%;background:#fff;border-bottom:1px solid var(--line)}.brand{font:800 27px Manrope;color:var(--ink);text-decoration:none;letter-spacing:-1.5px}.brand span{font-weight:400}.brand i{font-style:normal;color:#34b7f1;margin-left:9px}nav{display:flex;gap:30px;margin-left:50px;height:100%}nav button{border:0;background:none;color:#6b7b96;position:relative}nav .active{color:var(--ink);font-weight:700}nav .active:after{content:'';height:3px;background:var(--green);position:absolute;bottom:0;left:0;right:0}nav b{font-size:10px;background:#eaf1ff;padding:3px 6px;border-radius:20px}.location{margin-left:auto;border:1px solid var(--line);background:white;border-radius:25px;padding:11px 16px}.avatar{background:#e5edff;border-radius:50%;padding:12px 16px}main{max-width:1400px;margin:auto;padding:32px 6% 60px}.hero{display:grid;grid-template-columns:1.15fr 1fr;border-radius:20px;overflow:hidden;background:#e6efff;min-height:350px}.hero-copy{padding:40px 45px;position:relative}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;text-transform:uppercase}.eyebrow:before{content:'●';color:#34b7f1;margin-right:8px}h1{font:800 47px/1.13 Manrope;letter-spacing:-2px;margin:20px 0 16px;max-width:460px}h1 em{font-family:Georgia;font-weight:400;color:#286ef0}p{line-height:1.7;color:#607393}.hero p{max-width:370px}.hero-art{position:relative;background:url('https://images.unsplash.com/photo-1555507036-ab1f4038808a?w=1000&auto=format&fit=crop') center/cover}.hero-art:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#e6efff,transparent 25%)}.art-note{position:absolute;bottom:25px;right:25px;background:#f8fbff;padding:15px 20px;border-radius:12px;transform:rotate(-4deg);box-shadow:0 4px 20px #0001}.art-note strong{display:block;font-family:Georgia;font-size:22px}.primary{background:var(--green);color:white;border:0;border-radius:8px;padding:13px 20px;font-weight:700}.hero .primary{margin-top:10px}.trust{display:flex;justify-content:space-between;gap:20px;padding:24px 15px;border-bottom:1px solid var(--line);font-size:12px}.trust span{display:flex;align-items:center;gap:10px}.trust i{font-style:normal;font-size:20px}.section-top{display:flex;align-items:end;justify-content:space-between;margin:36px 0 20px}h2{font:800 25px Manrope;letter-spacing:-.7px;margin:0 0 7px}.section-top p{margin:0;font-size:12px}.search{display:flex;background:white;border:1px solid var(--line);border-radius:9px;padding:11px 14px;width:310px;gap:10px}.search input{border:0;outline:none;width:100%;background:none}.filters{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:25px}.chip{border:1px solid var(--line);background:white;padding:10px 16px;border-radius:25px;font-size:12px}.chip.selected{background:var(--ink);color:white;border-color:var(--ink)}.area{margin-left:auto;border-radius:8px}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.card{background:white;border-radius:14px;overflow:hidden;border:1px solid var(--line);transition:transform .2s}.card:hover{transform:translateY(-4px)}.photo{height:190px;position:relative;overflow:hidden}.photo img{width:100%;height:100%;object-fit:cover;transition:transform .3s}.card:hover img{transform:scale(1.04)}.badge{position:absolute;top:12px;left:12px;background:#fffffff2;border-radius:5px;font-size:9px;padding:6px 8px;font-weight:700}.heart{position:absolute;right:12px;top:10px;background:#fff;border:0;border-radius:50%;height:29px;width:29px;font-size:20px}.body{padding:17px}.maker{font-size:10px;color:#72809b}.maker span{color:#286ef0}.card h3{font:800 15px Manrope;margin:9px 0}.rating{font-size:11px;color:#6b7c98;display:flex;justify-content:space-between}.rating b{color:#b58c35}.price{display:flex;justify-content:space-between;align-items:end;border-top:1px solid #edf1fa;margin-top:15px;padding-top:13px}.price small{display:block;color:#6e7e9b;font-size:9px;margin-bottom:4px}.price strong{font-size:16px}.price button{border:0;background:#eaf1ff;border-radius:7px;padding:8px 11px;font-size:15px}.bottom-banner{background:#e6efff;display:flex;align-items:center;justify-content:space-between;padding:28px 35px;border-radius:14px;margin-top:38px}.bottom-banner h2{font-size:21px}.bottom-banner p{margin:0;font-size:12px}.outline{border:1px solid #b8cbef;background:none;border-radius:7px;padding:12px 18px}footer{border-top:1px solid var(--line);display:flex;align-items:center;gap:30px;padding:28px 6%;background:white}footer .brand{font-size:20px}footer span,footer small{font-size:10px;color:#6b7b96}footer small{margin-left:auto}dialog{border:0;border-radius:18px;padding:28px;width:min(520px,92vw);color:var(--ink);box-shadow:0 20px 100px #0003}dialog::backdrop{background:#14284b80;backdrop-filter:blur(3px)}.close{float:right;border:0;background:#eaf1ff;border-radius:50%;padding:7px 11px}dialog h2{margin:10px 0 15px}label{display:block;font-size:12px;margin:16px 0 6px}input,select,textarea{width:100%;padding:11px;border:1px solid var(--line);border-radius:7px;background:white;color:var(--ink)}.total{display:flex;justify-content:space-between;padding:20px 0;font-size:18px}dialog .primary{width:100%;margin-top:15px}.notice{background:#edf3ff;padding:12px;border-radius:8px;font-size:11px;line-height:1.6;color:#526b94}.empty{padding:65px 20px;text-align:center;grid-column:1/-1}.order,.panel{background:white;border:1px solid var(--line);border-radius:14px;padding:24px;margin:20px 0}.order-top{display:flex;justify-content:space-between;gap:20px}.steps{display:flex;justify-content:space-between;margin:25px 0;gap:8px}.steps span{flex:1;border-top:3px solid #e0e9fb;padding-top:12px;font-size:11px}.steps .done{border-color:var(--green);color:var(--green)}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.metrics strong{font-size:30px;display:block;margin-top:12px}.table-row{display:grid;grid-template-columns:2fr 1fr 1fr;gap:15px;padding:17px 0;border-bottom:1px solid var(--line)}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;border-radius:9px;padding:14px 22px;display:none;z-index:5}@media(max-width:900px){header{padding:0 4%;gap:15px}nav{margin-left:10px;gap:15px}.grid{grid-template-columns:repeat(2,1fr)}h1{font-size:36px}.hero-copy{padding:30px}.location{font-size:10px}.trust{flex-wrap:wrap}.hero{min-height:320px}footer{flex-wrap:wrap}footer small{margin-left:0}}@media(max-width:600px){header{height:auto;flex-wrap:wrap;padding:18px 5% 0}.brand{font-size:24px}nav{order:4;width:100%;height:50px;margin:0;justify-content:space-between}.location{padding:8px}.avatar{display:none}main{padding:20px 5%}.hero{grid-template-columns:1fr}.hero-art{height:180px;grid-row:2}.hero-copy{padding:25px}h1{font-size:37px;margin-top:15px}.hero p{font-size:12px}.trust{gap:14px;font-size:10px;padding:20px 0}.section-top{display:block}.search{margin-top:18px;width:100%}.grid{gap:12px}.photo{height:155px}.body{padding:12px}.card h3{font-size:12px}.rating{font-size:9px}.price strong{font-size:14px}.area{margin-left:0}.bottom-banner{padding:22px;gap:20px}.bottom-banner h2{font-size:17px}.metrics{grid-template-columns:1fr}.steps{flex-wrap:wrap}.steps span{min-width:40%}footer{gap:15px}.order-top{flex-wrap:wrap}}

/* Hermes Hub brand palette from Figma: blue #286EF0, sky #34B7F1. */
.brand{display:inline-block;width:84px;height:76px;overflow:hidden;flex-shrink:0;vertical-align:middle}.brand img{display:block;width:140px;height:140px;max-width:none;margin:-34px 0 0 -28px}nav{margin-left:25px}.chip.selected{background:var(--green);border-color:var(--green)}nav .active{color:var(--green)}.primary:hover{background:#1c59cb}.outline:hover{background:#eaf1ff}.primary:focus-visible,.chip:focus-visible,.outline:focus-visible{outline:3px solid #34b7f1;outline-offset:3px}input:focus,select:focus,textarea:focus{outline:2px solid #286ef0;outline-offset:2px}footer .brand{height:76px}button:disabled{opacity:.5;cursor:default}@media(max-width:600px){header .brand{height:70px}nav{margin-left:0}}

.hero-actions,.order-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.hero-actions{margin-top:18px}.hero-actions .primary{margin:0}.hero-actions .outline{background:#ffffff80}.maker-link{border:0;background:none;color:#286ef0;font-weight:700;padding:3px 0;text-align:left}.stage{margin:18px 0;padding:12px 16px;border-left:3px solid #286ef0;background:#edf3ff;font-weight:700}.brief-summary{background:#f7f9ff;border:1px solid var(--line);padding:16px;border-radius:10px;margin:15px 0}.brief-summary p{white-space:pre-wrap;overflow-wrap:anywhere}.order-actions{margin-top:18px}.portfolio{width:100%;height:190px;object-fit:cover;border-radius:10px}textarea{min-height:85px;resize:vertical}.check-label{display:flex;align-items:flex-start;gap:10px;line-height:1.6}.check-label input{width:auto;margin-top:4px}.thread{max-height:260px;overflow:auto;margin:16px 0}.message{padding:12px;background:#f1f4fa;border-radius:10px;margin:10px 0;overflow-wrap:anywhere}.message.buyer{background:#e6efff;margin-left:30px}.message p{margin:5px 0;white-space:pre-wrap}#sample-reply,#profile-buy{width:100%;margin-top:12px}.order h2,.order p{overflow-wrap:anywhere}button:focus-visible,a:focus-visible{outline:3px solid #34b7f1;outline-offset:3px}@media(max-width:600px){.hero-actions{align-items:stretch;flex-direction:column}.hero-actions button{width:100%}.order{padding:18px}.order-actions button{width:100%}}

.account-control{white-space:nowrap;font-size:11px;padding:10px}.role-tabs,.role-actions{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.role-tabs{border-bottom:1px solid var(--line);padding-bottom:18px}.review-row{padding:18px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.availability{border:1px solid var(--line);border-radius:8px;margin:20px 0;display:flex;flex-wrap:wrap;gap:14px}.availability label{display:flex;align-items:center;gap:7px;margin:8px 0}.availability input{width:auto}.availability legend{font-size:12px}.ledger{max-height:600px;overflow:auto}@media(max-width:900px){header{flex-wrap:wrap;height:auto;padding-top:10px;padding-bottom:10px}header nav{height:55px;order:4;width:100%;justify-content:space-around;margin:0}.account-control{margin-left:auto}.location{margin-left:auto}}@media(max-width:600px){.account-control{font-size:10px;padding:8px}.role-actions button{width:100%}.role-tabs button{flex:1}.availability{gap:12px}}