/* ===== v10 skin (14.9.2026): brick.me-style — white, airy, big photos, rounded headings, pill buttons.
   Colours stay Beadigo: lavender accent, bazooka-pink action, warm yellow only on icons/decor. */
:root{--paper:#fff;--grey:#f1f1f4;--yel:#ffc933;--round:'Rubik','Assistant',system-ui,sans-serif}
body{background:#fff}
h1,h2,h3{font-family:var(--round);font-weight:700;color:#3a3a3a;letter-spacing:-.01em}
h1{font-size:clamp(2.2rem,4.4vw,3.6rem);line-height:1.15}
h2{font-size:clamp(1.7rem,3vw,2.4rem);margin-bottom:12px}
h3{font-size:1.2rem}
.center{text-align:center}
.wrap{max-width:1200px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
/* header: quiet */
.nav{border-bottom:1px solid #ececf1;padding:14px clamp(16px,4vw,40px);box-shadow:0 1px 0 rgba(0,0,0,.02)}
.nav .btn.solid{border-radius:999px;border-color:transparent;box-shadow:none;padding:11px 22px}
.links a{font-weight:600;color:#3a3a3a}.login-link{border-color:#d8d8e0}
/* pills */
.pill{font:inherit;font-family:var(--round);font-weight:700;font-size:1.05rem;border:0;border-radius:999px;padding:15px 34px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;transition:transform .12s,filter .12s}
.pill:hover{transform:translateY(-1px);filter:brightness(1.04)}
.pill.cta{background:var(--cta);color:#22303a;box-shadow:0 6px 18px rgba(255,79,163,.28)}
.pill.lav{background:var(--pop);color:#fff;box-shadow:0 6px 18px rgba(124,92,214,.25)}
/* the rest of the site: soften the old brick buttons to match */
.btn{border-radius:999px;border-width:2px;box-shadow:none}.btn:hover{transform:none;box-shadow:none;filter:brightness(.97)}
.btn.solid{border-color:transparent;box-shadow:0 4px 14px rgba(255,79,163,.25)}
.btn.solid.big::before{display:none}
.tiny{color:#6b6b78}
/* hero */
.hero10{display:grid;grid-template-columns:1fr 1.15fr;gap:40px;align-items:center;padding-top:44px;padding-bottom:56px;position:relative}
.hero10-text .sub{font-size:1.1rem;color:#5b5b66;margin:14px 0 26px;max-width:34ch}
.hero10-img{margin:0}.hero10-img img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:18px;display:block;box-shadow:0 20px 50px rgba(34,48,58,.12)}
/* decorative 3D plates */
.plate3d{position:absolute;width:64px;height:48px;background:no-repeat center/contain;pointer-events:none;filter:drop-shadow(0 6px 8px rgba(0,0,0,.15))}
.p-lav{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 48'%3E%3Cpath d='M4 22l28-14 28 14v10L32 46 4 32z' fill='%235e43b3'/%3E%3Cpath d='M4 22l28-14 28 14-28 14z' fill='%237c5cd6'/%3E%3Cellipse cx='32' cy='18' rx='9' ry='4.5' fill='%239b82e6'/%3E%3Cpath d='M23 14v4a9 4.5 0 0 0 18 0v-4' fill='%238a6fdd'/%3E%3Cellipse cx='32' cy='14' rx='9' ry='4.5' fill='%23b09cf0'/%3E%3C/svg%3E")}
.p-pink{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 48'%3E%3Cpath d='M4 22l28-14 28 14v10L32 46 4 32z' fill='%23c72f7c'/%3E%3Cpath d='M4 22l28-14 28 14-28 14z' fill='%23ff4fa3'/%3E%3Cpath d='M23 14v4a9 4.5 0 0 0 18 0v-4' fill='%23e83f92'/%3E%3Cellipse cx='32' cy='14' rx='9' ry='4.5' fill='%23ff86c0'/%3E%3C/svg%3E")}
.p-yel{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 48'%3E%3Cpath d='M4 22l28-14 28 14v10L32 46 4 32z' fill='%23d9a400'/%3E%3Cpath d='M4 22l28-14 28 14-28 14z' fill='%23ffc933'/%3E%3Cpath d='M23 14v4a9 4.5 0 0 0 18 0v-4' fill='%23f0b800'/%3E%3Cellipse cx='32' cy='14' rx='9' ry='4.5' fill='%23ffe08a'/%3E%3C/svg%3E")}
.plate3d.a{left:-6px;top:120px;transform:rotate(-12deg)}.plate3d.b{right:40px;bottom:30px;transform:rotate(18deg) scale(.8)}.plate3d.c{left:12px;top:-10px;transform:rotate(25deg)}
/* benefits */
.benefits{list-style:none;padding:24px clamp(16px,4vw,40px) 40px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;text-align:center}
.benefits li{display:flex;flex-direction:column;align-items:center;gap:6px}
.benefits h3{font-size:1.15rem;margin-top:8px;color:#3a3a3a}.benefits p{margin:0;color:#6b6b78;max-width:30ch}
.bicon{width:116px;height:116px;border-radius:50%;display:grid;place-items:center}
.bicon.c1{background:var(--pop)}.bicon.c2{background:var(--cta)}.bicon.c3{background:var(--yel)}
.mini-plates{display:flex;gap:6px}.mini-plates i{width:16px;height:16px;border-radius:3px;background:#fff;box-shadow:inset 0 -3px 0 rgba(0,0,0,.12)}
.mini-plates i:nth-child(2){background:#ece5fb}.mini-plates i:nth-child(3){background:#ffc933}.mini-plates i:nth-child(4){background:#22303a}
/* how */
.how10{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center;padding-top:40px;padding-bottom:56px}
.how10-text p{color:#4b4b55;max-width:52ch}.how10 .ba{border-radius:16px;box-shadow:0 20px 50px rgba(34,48,58,.12);width:100%;max-width:640px}
.how10 .pill{margin-top:10px}
/* pricing panel */
.price10{padding-top:20px;padding-bottom:60px}
.panel{background:var(--grey);border-radius:20px;display:grid;grid-template-columns:1fr 1.2fr 1fr;overflow:hidden}
.p-opts{padding:36px 32px;border-inline-end:1px solid #e2e2e8}
.p-opts h3{margin:0 0 14px}.p-opts hr{border:0;border-top:1px solid #e2e2e8;margin:26px 0}
.p-choice{display:flex;flex-direction:column;gap:10px}
.p-choice button{font:inherit;font-weight:700;text-align:start;background:#fff;border:2px solid transparent;border-radius:12px;padding:12px 14px;cursor:pointer;display:flex;align-items:center;gap:12px;color:#3a3a3a}
.p-choice button.on{border-color:var(--pop);color:var(--pop-dark)}
.p-choice .sw{width:26px;height:26px;border-radius:6px;background:#c9c9d2;flex:none}
.p-choice button.on .sw.kit{background:var(--pop)}.p-choice button.on .sw.built{background:var(--cta)}
.p-size{margin:0 0 6px}
.p-pic{padding:36px 40px;display:grid;place-items:center}
.p-orig{position:absolute;top:-18px;right:-18px;display:block;width:104px;aspect-ratio:1;object-fit:cover;border-radius:10px;border:4px solid #fff;box-shadow:0 10px 26px rgba(0,0,0,.18);z-index:2}.p-arrow{display:none}
.p-fig{position:relative;width:100%;max-width:340px;padding:0 0 34px 34px}
.p-fig img.board{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.1);display:block}
.dim{position:absolute;font-size:.9rem;color:#4b4b55;display:flex;align-items:center;justify-content:center}
.dim i{position:absolute;background:#8a8a96}.dim i::before,.dim i::after{content:"";position:absolute;width:8px;height:8px;border:1.5px solid #8a8a96;border-width:1.5px 0 0 1.5px}
.dim.v{left:0;top:0;bottom:34px;width:34px}.dim.v i{width:1.5px;top:0;bottom:0;left:10px}.dim.v i::before{top:-1px;left:-3.5px;transform:rotate(45deg)}.dim.v i::after{bottom:-1px;left:-3.5px;transform:rotate(225deg)}
.dim.v b{writing-mode:vertical-rl;transform:rotate(180deg);font-weight:600;background:var(--grey);padding:6px 0;position:relative;left:-2px}
.dim.h{left:34px;right:0;bottom:0;height:34px}.dim.h i{height:1.5px;left:0;right:0;top:10px}.dim.h i::before{left:-1px;top:-3.5px;transform:rotate(-45deg)}.dim.h i::after{right:-1px;top:-3.5px;transform:rotate(135deg)}
.dim.h b{font-weight:600;background:var(--grey);padding:0 8px;position:relative;top:-2px}
.p-price{padding:36px 32px;border-inline-start:1px solid #e2e2e8;display:flex;flex-direction:column;gap:6px}
.p-price .big{font-family:var(--round);font-size:2.9rem;margin:0;color:#3a3a3a;line-height:1}
.p-price .what{font-size:1.15rem;color:#3a3a3a;margin:0 0 8px;font-weight:600}
.p-list{margin:0 0 8px;padding-inline-start:18px;color:#4b4b55;font-size:.95rem}.p-list li{margin:3px 0}
.p-price .pill{align-self:flex-start;margin-top:8px}
/* gift / built */
.gift10{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center;padding-top:30px;padding-bottom:70px;position:relative}
.gift10 figure{margin:0}.gift10 img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:18px;display:block;box-shadow:0 20px 50px rgba(34,48,58,.12)}
.gift10 .lead{font-weight:600;color:#3a3a3a}.gift10 p{color:#4b4b55}.price-line{font-size:1.2rem}.price-line b{font-family:var(--round);font-size:1.6rem;color:var(--pop-dark)}
/* gallery */
.gallery10{padding-bottom:60px}.gallery10 .lead{color:#6b6b78;margin-bottom:22px}
.cards{display:flex;gap:18px;overflow-x:auto;padding:6px 2px 16px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.card{flex:0 0 220px;scroll-snap-align:start;text-decoration:none;color:#3a3a3a;display:flex;flex-direction:column;gap:4px}
.card img{width:220px;aspect-ratio:1;object-fit:cover;border-radius:12px;box-shadow:0 8px 22px rgba(0,0,0,.08)}
.card b{font-family:var(--round);font-weight:700;font-size:1.05rem;margin-top:8px}.card span{color:#6b6b78;font-size:.92rem}
/* box */
.box10{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding-bottom:70px}
.box10 img{width:100%;border-radius:18px;display:block}.box10 .box-list{padding-inline-start:18px;color:#4b4b55}.box10 .box-list li{margin:6px 0}
/* FAQ */
.faq10{background:var(--grey);padding:56px 0 64px}
.faq-cols{display:grid;grid-template-columns:1fr 1fr;gap:0 48px;margin-top:20px}
.faq-cols details{border-bottom:1px solid #d9d9e0;padding:16px 0}
.faq-cols summary{list-style:none;cursor:pointer;font-weight:600;color:#3a3a3a;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq-cols summary::-webkit-details-marker{display:none}
.faq-cols summary::after{content:"";width:34px;height:34px;border-radius:50%;background:var(--pop) no-repeat center/14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");flex:none;transition:transform .2s}
.faq-cols details[open] summary::after{transform:rotate(180deg)}
.faq-cols p{color:#4b4b55;margin:10px 0 0;max-width:60ch}
/* collage */
.collage10{padding:60px clamp(16px,4vw,40px) 70px}
.collage{position:relative;display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;gap:8px;border-radius:22px;overflow:hidden}
.collage img{width:100%;height:100%;object-fit:cover;display:block}
.collage-cta{position:absolute;inset:0;margin:auto;width:min(520px,80%);height:min(300px,70%);background:#fff;border-radius:18px;box-shadow:0 20px 60px rgba(0,0,0,.25);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center}
.collage-cta .brand-mark{width:44px;height:44px;border-radius:9px}
.collage-cta h2{margin:0;font-size:2.2rem}.collage-cta em{font-style:normal;color:var(--pop)}
/* discount tab + popup */
.disc-tab{position:fixed;left:0;top:45%;z-index:20;background:var(--pop);color:#fff;border:0;border-radius:0 10px 10px 0;padding:14px 10px;font:inherit;font-weight:700;writing-mode:vertical-rl;transform:rotate(180deg);cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.18);letter-spacing:.02em}
.disc-tab:hover{background:var(--pop-dark)}
.disc-box{position:relative;background:var(--pop);color:#fff;border-radius:14px;padding:56px 32px 130px;max-width:480px;width:100%;text-align:center;overflow:hidden}
.disc-box::before{content:"";position:absolute;left:0;right:0;top:0;height:16px;background:#fff;-webkit-mask:var(--stud) repeat-x center top;mask:var(--stud) repeat-x center top;-webkit-mask-size:48px 14px;mask-size:48px 14px;opacity:.9}
.disc-box h2{color:#fff;font-size:1.9rem;margin:0 0 6px}.disc-box p{margin:0 0 18px;color:#e9e3fb}
.disc-box form{display:flex;flex-direction:column;gap:10px}
.disc-box input{width:100%;font:inherit;padding:14px 16px;border:0;border-radius:8px;background:#fff;color:#22303a;margin:0}
.disc-box .pill{width:100%;margin-top:4px}
.disc-x{position:absolute;top:14px;left:14px;background:none;border:0;color:#fff;font-size:1.3rem;cursor:pointer}
.disc-no{display:block;margin-top:14px;color:#e9e3fb;font-size:.92rem}
.disc-done{font-size:1.3rem;background:#fff;color:#22303a;border-radius:10px;padding:16px;margin:10px 0 0!important}
.disc-done b{font-family:var(--round);font-size:1.8rem;letter-spacing:.1em;display:block;margin-top:4px;color:var(--pop-dark)}
.disc-plates{position:absolute;left:0;right:0;bottom:-30px;height:120px;pointer-events:none}
.disc-plates i{position:absolute;bottom:0;width:120px;height:90px;background:no-repeat center/contain}
.disc-plates i:nth-child(1){left:-30px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 48'%3E%3Cpath d='M4 22l28-14 28 14v10L32 46 4 32z' fill='%23c72f7c'/%3E%3Cpath d='M4 22l28-14 28 14-28 14z' fill='%23ff4fa3'/%3E%3Cellipse cx='32' cy='14' rx='9' ry='4.5' fill='%23ff86c0'/%3E%3C/svg%3E")}
.disc-plates i:nth-child(2){left:70px;bottom:-20px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 48'%3E%3Cpath d='M4 22l28-14 28 14v10L32 46 4 32z' fill='%23d9a400'/%3E%3Cpath d='M4 22l28-14 28 14-28 14z' fill='%23ffc933'/%3E%3Cellipse cx='32' cy='14' rx='9' ry='4.5' fill='%23ffe08a'/%3E%3C/svg%3E")}
.disc-plates i:nth-child(3){left:50%;margin-left:-60px;bottom:-30px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 48'%3E%3Cpath d='M4 22l28-14 28 14v10L32 46 4 32z' fill='%2322303a'/%3E%3Cpath d='M4 22l28-14 28 14-28 14z' fill='%2334485a'/%3E%3Cellipse cx='32' cy='14' rx='9' ry='4.5' fill='%234f6a80'/%3E%3C/svg%3E")}
.disc-plates i:nth-child(4){right:60px;bottom:-16px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 48'%3E%3Cpath d='M4 22l28-14 28 14v10L32 46 4 32z' fill='%23bfbfc8'/%3E%3Cpath d='M4 22l28-14 28 14-28 14z' fill='%23ffffff'/%3E%3Cellipse cx='32' cy='14' rx='9' ry='4.5' fill='%23ececf1'/%3E%3C/svg%3E")}
.disc-plates i:nth-child(5){right:-30px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 48'%3E%3Cpath d='M4 22l28-14 28 14v10L32 46 4 32z' fill='%235e43b3'/%3E%3Cpath d='M4 22l28-14 28 14-28 14z' fill='%239b82e6'/%3E%3Cellipse cx='32' cy='14' rx='9' ry='4.5' fill='%23c9b8ff'/%3E%3C/svg%3E")}
/* footer: keep dark but flatter */
.foot{background-image:none;border-radius:0}
/* mobile */
@media (max-width:900px){
  .hero10,.how10,.gift10,.box10{grid-template-columns:1fr;gap:26px;padding-top:24px;padding-bottom:40px}
  .hero10-text{order:1}.hero10-img{order:2}.hero10 .plate3d{display:none}.plate3d.c{display:none}
  .benefits{grid-template-columns:1fr;gap:26px;padding-bottom:28px}
  .panel{grid-template-columns:1fr}.p-opts,.p-price{border:0;padding:24px 20px}.p-pic{padding:10px 20px 20px}.p-opts hr{margin:18px 0}
  .faq-cols{grid-template-columns:1fr}
  .collage{grid-template-columns:repeat(2,1fr);grid-auto-rows:160px;border-radius:14px}.collage-cta{position:static;width:auto;height:auto;padding:22px 16px 28px;margin:12px 0 0;box-shadow:none;border:1.5px solid #e4e2ee;grid-column:1/-1}.collage-cta h2{font-size:1.6rem}
  .p-orig{width:84px;top:-12px;right:-8px}
  .cards .card,.card img{flex-basis:180px;width:180px}
  .disc-tab{top:auto;bottom:90px;font-size:.9rem}
  .disc-box{padding:48px 20px 110px}
}
/* logo compacts on scroll (like brick.me) */
.nav{transition:padding .2s}.nav.scrolled{padding-top:8px;padding-bottom:8px}
.brand-mark,.brand-name,.brand-by{transition:all .2s}
.nav.scrolled .brand-by{font-size:.58rem}.nav.scrolled .brand-name{font-size:1.25rem}.nav.scrolled .brand-mark{width:26px;height:26px}
/* sign-in in the v10 skin */
.authband{background:#fff;padding:40px 16px 60px}
.auth{max-width:900px;margin:0 auto}.auth .sub{text-align:center;color:#5b5b66;margin:6px 0 26px}
.auth-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.auth-cols form{background:#fff;border:1.5px solid #e4e2ee;border-radius:16px;padding:24px 26px;box-shadow:0 8px 24px rgba(34,48,58,.06)}
.auth-cols form h3{margin:0 0 12px}.auth-cols label{display:block;margin:10px 0;font-weight:600;color:#3a3a3a}
.auth-cols input:not([type=checkbox]){border:1.5px solid #d8d8e0;border-radius:10px;padding:12px 14px;font-weight:400}
.auth-cols input:focus{outline:3px solid var(--accent-soft);border-color:var(--pop)}
.auth-cols .check{font-weight:400;display:flex;gap:8px;align-items:flex-start}
.auth-cols .btn.solid{width:100%;justify-content:center;margin-top:12px;border-radius:999px}
.auth-cols .btn.google{width:100%;max-width:none;justify-content:center;border-radius:999px;margin-top:8px;border:1.5px solid #d8d8e0}
@media (max-width:800px){.auth-cols{grid-template-columns:1fr}}
/* gallery: original next to the board */
.card.pair2{flex-basis:340px}.card.pair2 .p2{display:grid;grid-template-columns:1fr 1fr;gap:4px;direction:ltr}
.card.pair2 .p2 img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;box-shadow:0 8px 22px rgba(0,0,0,.08)}
@media (max-width:900px){.card.pair2{flex-basis:300px}}