/* [R3] ajcabinetry.nw — NeuraSite CSS | [R14] theme vars only */ [data-theme="dark"]{--bg:#0C0906;--bg1:#131009;--bg2:#1A1510;--bg3:#211A13;--bg-glass:rgba(19,16,9,0.82);--t1:#F0E8D8;--t2:#9C8E78;--t3:#5A4E3C;--t4:#3A3028;--gold:#C8943A;--gold-lt:#E0AA50;--gold-dim:rgba(200,148,58,0.15);--gold-glow:rgba(200,148,58,0.25);--border:rgba(200,148,58,0.12);--border-md:rgba(200,148,58,0.22);--border-str:rgba(200,148,58,0.38);--radius:6px;--radius-lg:12px;--shadow:0 16px 48px rgba(0,0,0,0.6);--shadow-sm:0 4px 16px rgba(0,0,0,0.4);} [data-theme="light"]{--bg:#F8F4EE;--bg1:#FFFFFF;--bg2:#F2EDE6;--bg3:#EAE3D8;--bg-glass:rgba(248,244,238,0.88);--t1:#1C160E;--t2:#5A4E3C;--t3:#9C8E78;--t4:#C8BCB0;--gold:#9A6A1A;--gold-lt:#B07A28;--gold-dim:rgba(154,106,26,0.1);--gold-glow:rgba(154,106,26,0.18);--border:rgba(90,78,60,0.12);--border-md:rgba(90,78,60,0.22);--border-str:rgba(90,78,60,0.38);--radius:6px;--radius-lg:12px;--shadow:0 16px 48px rgba(0,0,0,0.12);--shadow-sm:0 4px 16px rgba(0,0,0,0.08);} html[data-fontsize="sm"]{font-size:13px;} html[data-fontsize="md"]{font-size:16px;} html[data-fontsize="lg"]{font-size:19px;} *,*::before,*::after{box-sizing:border-box;margin:0;padding:0;} html{font-size:16px;scroll-behavior:smooth;} body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--t1);line-height:1.6;transition:background .3s,color .3s;overflow-x:hidden;-webkit-font-smoothing:antialiased;} a{color:inherit;text-decoration:none;} button{cursor:pointer;font-family:inherit;} input,select,textarea{font-family:inherit;} /* Sysbar */ .nw-sysbar{position:fixed;top:0;left:0;right:0;z-index:1000;height:32px;background:var(--bg);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 24px;transition:background .3s;} .nw-sysbar-l{display:flex;align-items:center;gap:10px;} .nw-mark{width:20px;height:20px;border-radius:4px;background:var(--gold);display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:#fff;flex-shrink:0;} .nw-sys-txt{font-size:10px;color:var(--t3);letter-spacing:.1em;text-transform:uppercase;} .nw-divider{width:1px;height:12px;background:var(--border-md);} .nw-domain{font-size:10px;color:var(--gold);font-weight:500;letter-spacing:.05em;} .nw-sysbar-r{display:flex;align-items:center;gap:10px;} .nw-chip{font-size:9px;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--border);padding:2px 9px;border-radius:20px;color:var(--t3);} .nw-chip.live{color:#3A9A5C;border-color:rgba(58,154,92,.35);} .txt-size-group{display:flex;align-items:center;gap:1px;background:var(--bg3);border:1px solid var(--border-md);border-radius:6px;overflow:hidden;flex-shrink:0;} .txt-size-btn{background:transparent;border:none;cursor:pointer;color:var(--t3);padding:0 8px;height:22px;font-family:'DM Sans',sans-serif;font-weight:500;transition:color .18s,background .18s;display:flex;align-items:center;justify-content:center;border-right:1px solid var(--border);line-height:1;} .txt-size-btn:last-child{border-right:none;} .txt-size-btn:hover,.txt-size-btn.active{color:var(--gold);background:var(--gold-dim);} .txt-size-btn.sz-s{font-size:10px;}.txt-size-btn.sz-m{font-size:12px;}.txt-size-btn.sz-l{font-size:14px;} .fs-btn{width:22px;height:22px;border-radius:5px;background:var(--bg3);border:1px solid var(--border-md);cursor:pointer;color:var(--t3);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:color .18s,border-color .18s,background .18s;padding:0;} .fs-btn:hover{color:var(--gold);border-color:var(--border-str);background:var(--gold-dim);} .theme-toggle{width:36px;height:20px;border-radius:10px;background:var(--bg3);border:1px solid var(--border-md);position:relative;cursor:pointer;transition:background .3s;display:flex;align-items:center;padding:0 3px;flex-shrink:0;} .theme-toggle-knob{width:14px;height:14px;border-radius:50%;background:var(--gold);transition:transform .25s;display:flex;align-items:center;justify-content:center;font-size:8px;} [data-theme="light"] .theme-toggle-knob{transform:translateX(16px);} /* Nav */ .main-nav{position:fixed;top:32px;left:0;right:0;z-index:999;height:64px;background:var(--bg-glass);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 48px;transition:background .3s;} .nav-brand{display:flex;flex-direction:column;gap:2px;} .nav-brand-main{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--t1);letter-spacing:.02em;line-height:1;} .nav-brand-sub{font-size:10px;color:var(--gold);letter-spacing:.16em;text-transform:uppercase;} .nav-links{display:flex;align-items:center;gap:32px;list-style:none;} .nav-links a{font-size:12px;color:var(--t2);letter-spacing:.08em;text-transform:uppercase;font-weight:500;transition:color .2s;position:relative;padding-bottom:2px;} .nav-links a::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .25s;} .nav-links a:hover,.nav-links a.active{color:var(--gold);} .nav-links a:hover::after,.nav-links a.active::after{transform:scaleX(1);} .nav-cta{background:var(--gold);color:#fff;padding:10px 24px;border-radius:var(--radius);font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;border:none;transition:background .2s,transform .2s;box-shadow:0 4px 18px var(--gold-glow);} .nav-cta:hover{background:var(--gold-lt);transform:translateY(-1px);} /* Sections */ section{width:100%;padding:100px 80px;} .eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:14px;} .eyebrow-line{width:28px;height:1px;background:var(--gold);flex-shrink:0;} .eyebrow-text{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:500;} .section-title{font-family:'Cormorant Garamond',serif;font-size:clamp(32px,4vw,52px);font-weight:600;color:var(--t1);line-height:1.1;margin-bottom:16px;} .section-title em{font-style:italic;color:var(--gold);} .section-body{font-size:16px;line-height:1.75;color:var(--t2);max-width:540px;font-weight:300;} /* Hero */ #hero{min-height:100vh;padding-top:calc(96px + 80px);display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center;background:var(--bg);position:relative;overflow:hidden;} #hero::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 65% 60% at 75% 50%,var(--gold-dim) 0%,transparent 70%),radial-gradient(ellipse 40% 50% at 15% 80%,rgba(200,148,58,.04) 0%,transparent 60%);} .hero-content{position:relative;z-index:2;} .hero-badge{display:inline-flex;align-items:center;gap:8px;background:var(--gold-dim);border:1px solid var(--border-md);padding:6px 14px;border-radius:20px;margin-bottom:24px;} .hero-badge-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);} .hero-badge-txt{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);font-weight:500;} h1{font-family:'Cormorant Garamond',serif;font-size:clamp(48px,6.5vw,88px);font-weight:700;line-height:1;color:var(--t1);margin-bottom:12px;} h1 em{font-style:italic;color:var(--gold);} .hero-headline-2{font-family:'Cormorant Garamond',serif;font-size:clamp(22px,2.8vw,36px);font-weight:300;color:var(--t2);margin-bottom:24px;font-style:italic;} .hero-desc{font-size:17px;line-height:1.8;color:var(--t2);max-width:500px;font-weight:300;margin-bottom:40px;} .hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:56px;} .btn-primary{background:var(--gold);color:#fff;padding:15px 34px;border-radius:var(--radius);font-size:13px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;border:none;box-shadow:0 6px 28px var(--gold-glow);transition:background .2s,transform .2s,box-shadow .2s;display:inline-block;} .btn-primary:hover{background:var(--gold-lt);transform:translateY(-2px);box-shadow:0 10px 36px var(--gold-glow);} .btn-ghost{background:transparent;color:var(--t2);padding:15px 30px;border-radius:var(--radius);border:1px solid var(--border-md);font-size:13px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;transition:border-color .2s,color .2s;display:inline-block;} .btn-ghost:hover{color:var(--gold);border-color:var(--border-str);} .hero-stats{display:flex;gap:48px;} .stat-num{font-family:'Cormorant Garamond',serif;font-size:40px;font-weight:700;color:var(--gold);line-height:1;} .stat-label{font-size:11px;letter-spacing:.1em;color:var(--t3);text-transform:uppercase;margin-top:4px;} /* Kitchen visual */ .hero-visual{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;min-height:0;overflow:hidden;} .kitchen-frame{width:100%;aspect-ratio:5/4;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;display:flex;flex-direction:column;padding:28px 28px 0;gap:6px;box-shadow:var(--shadow);transition:background .3s,border-color .3s;} .cab-row{display:flex;gap:4px;} .cab-upper .cab-row{height:80px;} .cab-lower .cab-row{height:68px;} .cab{flex:1;background:var(--bg3);border:1px solid var(--border);border-radius:3px 3px 0 0;position:relative;transition:background .3s,border-color .3s;} .cab-lower .cab{border-radius:0;} .cab-handle{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);width:24px;height:2px;background:var(--gold);border-radius:1px;opacity:.55;} .cab-handle.top{bottom:auto;top:12px;} .countertop{height:12px;background:var(--t4);border-radius:1px;opacity:.4;} .island-wrap{width:55%;margin:8px auto 0;background:var(--bg3);border:1px solid var(--border);border-radius:4px;overflow:hidden;flex-shrink:0;} .island-top{height:10px;background:var(--t3);opacity:.3;} .kitchen-label{text-align:center;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--t3);padding:12px 0 16px;} .hero-float-badge{position:absolute;top:20px;right:-16px;background:var(--gold);color:#fff;font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:8px 16px;border-radius:20px;box-shadow:0 4px 18px var(--gold-glow);} .hero-float-card{position:absolute;bottom:40px;right:-28px;width:170px;background:var(--bg1);border:1px solid var(--border-md);border-radius:var(--radius-lg);padding:18px;box-shadow:var(--shadow);text-align:center;transition:background .3s;} .hfc-label{font-size:11px;letter-spacing:.1em;color:var(--gold);text-transform:uppercase;font-weight:500;margin-bottom:3px;} .hfc-sub{font-size:10px;color:var(--t3);} /* Marquee */ .marquee-band{background:var(--gold);width:100%;overflow:hidden;padding:13px 0;border-top:1px solid var(--border-str);border-bottom:1px solid var(--border-str);} .marquee-track{display:flex;white-space:nowrap;animation:marquee 24s linear infinite;} .marquee-item{flex-shrink:0;padding:0 20px;font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgba(0,0,0,.8);display:flex;align-items:center;gap:20px;} .marquee-sep{width:4px;height:4px;border-radius:50%;background:rgba(0,0,0,.3);flex-shrink:0;} @keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}} /* Services grid */ .services-header{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:end;margin-bottom:56px;} .services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;} .svc-card{background:var(--bg1);padding:40px 32px;position:relative;overflow:hidden;cursor:default;transition:background .25s;} .svc-card:hover{background:var(--bg2);} .svc-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .3s;} .svc-card:hover::after{transform:scaleX(1);} .svc-num{font-family:'Cormorant Garamond',serif;font-size:52px;font-weight:700;color:var(--border-md);line-height:1;position:absolute;top:24px;right:24px;transition:color .25s;pointer-events:none;} .svc-card:hover .svc-num{color:var(--border-str);} .svc-name{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:600;color:var(--t1);margin-bottom:10px;margin-top:44px;} .svc-desc{font-size:14px;line-height:1.72;color:var(--t2);font-weight:300;} /* Process */ #process-home{background:var(--bg);display:grid;grid-template-columns:1fr 1.2fr;gap:80px;align-items:start;} .process-layout{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;align-items:start;} .process-steps{display:flex;flex-direction:column;} .proc-step{display:grid;grid-template-columns:52px 1fr;gap:20px;padding:28px 0;border-bottom:1px solid var(--border);transition:padding-left .25s;} .proc-step:first-child{border-top:1px solid var(--border);} .proc-step:hover{padding-left:6px;} .proc-num{font-family:'Cormorant Garamond',serif;font-size:30px;font-weight:700;color:var(--border-md);line-height:1;transition:color .25s;} .proc-step:hover .proc-num{color:var(--gold);} .proc-title{font-family:'Cormorant Garamond',serif;font-size:19px;font-weight:600;color:var(--t1);margin-bottom:6px;} .proc-desc{font-size:14px;line-height:1.7;color:var(--t2);font-weight:300;} .feature-box{background:var(--bg1);border:1px solid var(--border-md);border-radius:var(--radius-lg);padding:40px;position:relative;overflow:hidden;box-shadow:var(--shadow-sm);} .feature-box::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gold),var(--gold-lt),var(--gold));} .feat-title{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:700;color:var(--t1);margin-bottom:8px;} .feat-body{font-size:14px;color:var(--t2);line-height:1.7;font-weight:300;margin-bottom:24px;} .check-item{display:flex;align-items:center;gap:14px;padding:13px 16px;margin-bottom:8px;background:rgba(200,148,58,.04);border:1px solid var(--border);border-radius:var(--radius);transition:background .2s,border-color .2s;} .check-item:hover{background:var(--gold-dim);border-color:var(--border-md);} .check-dot{width:20px;height:20px;border-radius:50%;background:var(--gold-dim);border:1px solid var(--border-md);display:flex;align-items:center;justify-content:center;flex-shrink:0;} .check-label{font-size:14px;color:var(--t1);} .phone-card{padding:16px 20px;background:var(--gold-dim);border:1px solid var(--border-md);border-radius:var(--radius);display:flex;align-items:center;gap:14px;} .phone-card-label{font-size:10px;color:var(--gold);letter-spacing:.12em;text-transform:uppercase;margin-bottom:3px;} .phone-card-num{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:700;color:var(--t1);} /* Gallery */ .gallery-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:40px;} .filter-tabs{display:flex;gap:8px;} .filter-tab{padding:8px 18px;border-radius:20px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:500;cursor:pointer;border:1px solid var(--border-md);color:var(--t2);background:transparent;transition:all .2s;} .filter-tab.active,.filter-tab:hover{background:var(--gold-dim);border-color:var(--border-str);color:var(--gold);} .gallery-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:210px 190px 190px;gap:6px;} .g-item{border-radius:var(--radius);overflow:hidden;position:relative;cursor:pointer;transition:transform .25s,box-shadow .25s;} .g-item:hover{transform:scale(1.01);box-shadow:var(--shadow);z-index:2;} .g-item:nth-child(1){grid-column:1/6;grid-row:1;}.g-item:nth-child(2){grid-column:6/9;grid-row:1;}.g-item:nth-child(3){grid-column:9/13;grid-row:1;}.g-item:nth-child(4){grid-column:1/4;grid-row:2;}.g-item:nth-child(5){grid-column:4/8;grid-row:2;}.g-item:nth-child(6){grid-column:8/13;grid-row:2/4;}.g-item:nth-child(7){grid-column:1/5;grid-row:3;}.g-item:nth-child(8){grid-column:5/8;grid-row:3;} [data-theme="dark"] .g-dark{display:block;}[data-theme="dark"] .g-light{display:none;}[data-theme="light"] .g-dark{display:none;}[data-theme="light"] .g-light{display:block;} .g-art{width:100%;height:100%;display:flex;align-items:flex-end;padding:14px;} .g1d{background:linear-gradient(160deg,#2A1E14 0%,#3A2818 40%,#8A6040 100%)}.g2d{background:linear-gradient(150deg,#1E2A22 0%,#2A3A2C 50%,#5A7A5A 100%)}.g3d{background:linear-gradient(155deg,#1A2028 0%,#283040 50%,#5A7090 100%)}.g4d{background:linear-gradient(165deg,#3A2010 0%,#5A3818 50%,#9A6830 100%)}.g5d{background:linear-gradient(145deg,#2A2818 0%,#3A3828 40%,#7A7050 100%)}.g6d{background:linear-gradient(160deg,#1E1810 0%,#3A2C18 40%,#6A5230 100%)}.g7d{background:linear-gradient(155deg,#1A2828 0%,#283838 50%,#507070 100%)}.g8d{background:linear-gradient(150deg,#281820 0%,#382028 50%,#704050 100%)} .g1l{background:linear-gradient(160deg,#D8C8B4 0%,#E0D0B8 40%,#B09070 100%)}.g2l{background:linear-gradient(150deg,#C4D4C8 0%,#B0C4B4 50%,#788A78 100%)}.g3l{background:linear-gradient(155deg,#C4CCD8 0%,#B0BCCC 50%,#788898 100%)}.g4l{background:linear-gradient(165deg,#DCC8A8 0%,#CEB890 50%,#A08050 100%)}.g5l{background:linear-gradient(145deg,#D8D4C0 0%,#C8C4B0 40%,#A09880 100%)}.g6l{background:linear-gradient(160deg,#D0C8B0 0%,#C0B89C 40%,#907858 100%)}.g7l{background:linear-gradient(155deg,#C0D0D0 0%,#B0C0C0 50%,#708080 100%)}.g8l{background:linear-gradient(150deg,#D0C0C8 0%,#C0B0B8 50%,#907080 100%)} .g-label{background:rgba(0,0,0,.55);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.1);padding:5px 11px;border-radius:20px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#E8DDD0;} [data-theme="light"] .g-label{background:rgba(255,255,255,.7);color:#3A2C1C;border-color:rgba(0,0,0,.1);} .g-item::before{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.4) 0%,transparent 55%);pointer-events:none;} /* About */ #about{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;} .about-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;} .about-visual-frame{aspect-ratio:4/5;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;box-shadow:var(--shadow-sm);} .about-visual-frame::before{content:'';position:absolute;inset:0;background-image:repeating-linear-gradient(0deg,transparent 0,transparent 22px,var(--border) 22px,var(--border) 23px);opacity:.5;} .about-icon-label{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);font-weight:500;} .about-accent-card{position:absolute;bottom:-20px;right:-20px;width:120px;background:var(--gold);border-radius:10px;padding:18px;box-shadow:0 10px 32px var(--gold-glow);z-index:3;} .accent-num{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:700;color:#fff;line-height:1;} .accent-label{font-size:10px;color:rgba(255,255,255,.7);letter-spacing:.08em;text-transform:uppercase;margin-top:4px;} .about-name-badge{display:inline-flex;align-items:center;gap:10px;background:var(--gold-dim);border:1px solid var(--border-md);padding:7px 14px;border-radius:20px;margin-bottom:24px;} .about-name-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);} .about-name-txt{font-size:11px;letter-spacing:.12em;color:var(--gold);text-transform:uppercase;font-weight:500;} .about-body{font-size:16px;line-height:1.8;color:var(--t2);font-weight:300;margin-bottom:32px;} .about-details{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:36px;} .about-detail{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);padding:18px;transition:border-color .2s,background .2s;} .about-detail:hover{border-color:var(--border-md);background:var(--bg3);} .about-detail-lbl{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--t3);margin-bottom:5px;} .about-detail-val{font-size:14px;color:var(--t1);line-height:1.5;} /* Testimonials / ratings strip */ .ratings-strip{display:flex;gap:24px;flex-wrap:wrap;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px 28px;margin-top:32px;align-items:center;} .rating-platform{display:flex;align-items:center;gap:12px;} .rating-platform-info{display:flex;flex-direction:column;gap:2px;} .rating-platform-name{font-size:12px;font-weight:500;color:var(--t1);} .rating-stars-row{color:var(--gold);font-size:12px;letter-spacing:2px;} .rating-num{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:700;color:var(--gold);} .ratings-divider{width:1px;height:40px;background:var(--border);} .testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;} .tcard{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:32px;transition:transform .25s,border-color .25s,box-shadow .25s;} .tcard:hover{transform:translateY(-3px);border-color:var(--border-md);box-shadow:var(--shadow-sm);} .tcard-verified{display:flex;align-items:center;gap:6px;font-size:10px;color:#3A9A5C;letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px;} .tcard-stars{color:var(--gold);font-size:14px;letter-spacing:3px;margin-bottom:14px;} .tcard-text{font-size:15px;line-height:1.75;color:var(--t2);font-style:italic;margin-bottom:24px;font-weight:300;} .tcard-author{display:flex;align-items:center;gap:12px;} .tcard-av{width:38px;height:38px;border-radius:50%;background:var(--gold);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:16px;font-weight:700;color:#fff;flex-shrink:0;} .tcard-name{font-size:14px;font-weight:500;color:var(--t1);} .tcard-loc{font-size:12px;color:var(--t3);margin-top:2px;} /* Contact */ #contact{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;} .ci-list{margin-top:32px;} .ci-item{display:grid;grid-template-columns:44px 1fr;gap:16px;padding:20px 0;border-bottom:1px solid var(--border);align-items:start;transition:padding-left .2s;} .ci-item:first-child{border-top:1px solid var(--border);} .ci-item:hover{padding-left:6px;} .ci-icon{width:36px;height:36px;border-radius:var(--radius);background:var(--gold-dim);border:1px solid var(--border-md);display:flex;align-items:center;justify-content:center;flex-shrink:0;} .ci-lbl{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:4px;} .ci-val{font-size:15px;color:var(--t1);line-height:1.5;} /* NeuraMaps */ .nw-map-widget{margin-top:20px;border-radius:var(--radius-lg);border:1px solid var(--border-md);overflow:hidden;box-shadow:var(--shadow-sm);} .nwm-header{background:var(--bg);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:8px 14px;height:34px;} .nwm-header-l{display:flex;align-items:center;gap:8px;} .nwm-logo{width:18px;height:18px;background:var(--gold);border-radius:3px;display:flex;align-items:center;justify-content:center;font-size:7px;font-weight:700;color:#fff;} .nwm-system-lbl{font-size:10px;font-weight:500;color:var(--t2);letter-spacing:.04em;} .nwm-sep{width:1px;height:12px;background:var(--border-md);} .nwm-domain-lbl{font-size:10px;color:var(--gold);font-weight:500;} .nwm-coord{font-size:9px;color:var(--t4);letter-spacing:.04em;} .nwm-canvas{position:relative;height:200px;background:var(--bg2);overflow:hidden;} .nwm-grid{position:absolute;inset:0;background-image:repeating-linear-gradient(0deg,var(--border) 0,var(--border) 1px,transparent 1px,transparent 36px),repeating-linear-gradient(90deg,var(--border) 0,var(--border) 1px,transparent 1px,transparent 48px);opacity:.55;} .nwm-water{position:absolute;border-radius:2px;} [data-theme="dark"] .nwm-water{background:rgba(30,60,120,.18);} [data-theme="light"] .nwm-water{background:rgba(80,130,200,.2);} .nwm-water-1{bottom:0;left:0;right:0;height:22px;} .nwm-water-2{top:60px;left:32%;width:5px;height:140px;opacity:.6;} .nwm-street{position:absolute;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--t3);font-weight:500;white-space:nowrap;pointer-events:none;} .nwm-st-1{top:92px;left:24px;transform:rotate(-90deg) translateX(-40px);transform-origin:left center;} .nwm-st-2{bottom:28px;left:50%;transform:translateX(-50%);} .nwm-st-3{top:12px;left:20px;} .nwm-block{position:absolute;border-radius:2px;opacity:.45;} [data-theme="dark"] .nwm-block{background:var(--t4);} [data-theme="light"] .nwm-block{background:var(--t3);} .nwm-block-a{top:30px;right:80px;width:58px;height:28px;} .nwm-block-b{top:28px;right:160px;width:38px;height:22px;} .nwm-block-c{bottom:38px;left:18px;width:48px;height:24px;} .nwm-block-d{bottom:36px;left:88px;width:34px;height:24px;} .nwm-pin-wrap{position:absolute;top:62px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;z-index:10;} .nwm-pin-pulse{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;background:var(--gold-dim);border:1px solid var(--border-md);animation:nwm-pulse 2.2s ease-out infinite;} @keyframes nwm-pulse{0%{transform:translate(-50%,-50%) scale(.7);opacity:.9}100%{transform:translate(-50%,-50%) scale(1.7);opacity:0}} .nwm-pin{width:32px;height:32px;border-radius:50% 50% 50% 0;background:var(--gold);transform:rotate(-45deg);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px var(--gold-glow);position:relative;z-index:2;} .nwm-pin-icon{transform:rotate(45deg);display:flex;} .nwm-pin-shadow{width:9px;height:4px;border-radius:50%;background:rgba(0,0,0,.22);margin-top:1px;} .nwm-popup{position:absolute;top:6px;left:50%;transform:translateX(-50%);background:var(--bg1);border:1px solid var(--border-md);border-radius:var(--radius);padding:10px 14px;min-width:176px;box-shadow:var(--shadow-sm);z-index:20;animation:nwm-popup .4s ease .3s both;} @keyframes nwm-popup{from{opacity:0;transform:translateX(-50%) translateY(8px)}to{opacity:1;transform:translateX(-50%) translateY(0)}} .nwm-popup-name{font-size:12px;font-weight:500;color:var(--t1);margin-bottom:3px;} .nwm-popup-addr{font-size:10px;color:var(--t3);line-height:1.45;margin-bottom:5px;} .nwm-popup-stars{font-size:10px;color:var(--gold);} .nwm-popup-rating{color:var(--t3);} .nwm-scale{position:absolute;bottom:28px;right:12px;display:flex;flex-direction:column;align-items:flex-start;gap:3px;} .nwm-scale-bar{width:44px;height:3px;background:linear-gradient(90deg,var(--gold) 50%,var(--bg3) 50%);border:1px solid var(--border-md);border-radius:1px;} .nwm-scale-lbl{font-size:8px;color:var(--t3);letter-spacing:.06em;} .nwm-compass{position:absolute;top:10px;right:12px;display:flex;flex-direction:column;align-items:center;background:var(--bg1);border:1px solid var(--border);border-radius:5px;padding:3px 6px;} .nwm-compass-n{font-size:8px;font-weight:700;color:var(--gold);letter-spacing:.08em;} .nwm-footer{background:var(--bg1);border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:10px 14px;gap:10px;flex-wrap:wrap;} .nwm-footer-addr{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--t2);font-weight:300;} .nwm-footer-actions{display:flex;gap:8px;} .nwm-btn{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:500;color:var(--t2);background:var(--bg2);border:1px solid var(--border);padding:7px 13px;border-radius:var(--radius);cursor:pointer;transition:border-color .2s,color .2s;letter-spacing:.04em;} .nwm-btn:hover{border-color:var(--border-md);color:var(--t1);} .nwm-btn-primary{background:var(--gold-dim);border-color:var(--border-md);color:var(--gold);} .nwm-btn-primary:hover{background:var(--gold-glow);} /* Contact form */ .contact-form{background:var(--bg1);border:1px solid var(--border-md);border-radius:var(--radius-lg);padding:44px;position:relative;overflow:hidden;box-shadow:var(--shadow-sm);} .contact-form::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gold),var(--gold-lt),var(--gold));} .nmp-badge{display:inline-flex;align-items:center;gap:7px;background:var(--gold-dim);border:1px solid var(--border-md);padding:5px 12px;border-radius:20px;margin-bottom:16px;} .nmp-badge-icon{width:14px;height:14px;stroke:var(--gold);stroke-width:2.2;fill:none;} .nmp-badge-txt{font-size:10px;letter-spacing:.1em;color:var(--gold);text-transform:uppercase;font-weight:500;} .form-title{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:700;color:var(--t1);margin-bottom:4px;} .form-subtitle{font-size:14px;color:var(--t2);margin-bottom:28px;font-weight:300;} .form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;} .form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;} .form-label{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--t3);font-weight:500;} .form-input,.form-select,.form-textarea{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);padding:13px 16px;font-size:15px;color:var(--t1);outline:none;width:100%;transition:border-color .2s,background .2s,box-shadow .2s;} .form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--gold);background:var(--bg3);box-shadow:0 0 0 3px var(--gold-dim);} .form-input::placeholder,.form-textarea::placeholder{color:var(--t3);} .form-select{cursor:pointer;}.form-select option{background:var(--bg2);} .form-textarea{min-height:110px;resize:vertical;line-height:1.6;} .form-submit{width:100%;background:var(--gold);color:#fff;border:none;padding:16px;border-radius:var(--radius);font-size:14px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;transition:background .2s,transform .2s,box-shadow .2s;box-shadow:0 4px 20px var(--gold-glow);margin-top:6px;cursor:pointer;} .form-submit:hover{background:var(--gold-lt);transform:translateY(-2px);box-shadow:0 8px 28px var(--gold-glow);} .form-submit:disabled{opacity:.6;cursor:not-allowed;transform:none;} .form-privacy{font-size:11px;color:var(--t3);text-align:center;margin-top:12px;line-height:1.6;} /* GlyphForge icon helpers — [R4] production: replace with S3 icons */ .gf{width:18px;height:18px;stroke:var(--gold);stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;} .gf-sm{width:14px;height:14px;stroke:var(--gold);stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round;} .gf-lg{width:52px;height:52px;stroke:var(--gold);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;} /* Footer */ footer{background:var(--bg);border-top:1px solid var(--border);padding:64px 80px 40px;} .footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:60px;margin-bottom:48px;} .footer-brand-name{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:700;color:var(--t1);margin-bottom:2px;} .footer-brand-sub{font-size:10px;color:var(--gold);letter-spacing:.16em;text-transform:uppercase;margin-bottom:14px;} .footer-brand-desc{font-size:13px;color:var(--t3);line-height:1.7;font-weight:300;margin-bottom:20px;} .footer-phone{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:700;color:var(--gold);} .footer-col-title{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:16px;} .footer-links{list-style:none;display:flex;flex-direction:column;gap:10px;} .footer-links li,.footer-links a{font-size:13px;color:var(--t3);font-weight:300;transition:color .2s;} .footer-links a:hover,.footer-links li:hover{color:var(--gold);} .footer-hours{display:flex;flex-direction:column;gap:8px;} .footer-hr{display:flex;justify-content:space-between;font-size:13px;} .footer-hr-day{color:var(--t3);font-weight:300;} .footer-hr-time{color:var(--t2);font-weight:400;} .footer-addr{margin-top:16px;font-size:13px;color:var(--t3);line-height:1.6;font-weight:300;} .footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:28px;border-top:1px solid var(--border);} .footer-copy{font-size:12px;color:var(--t3);font-weight:300;} .nw-footer-badge{display:flex;align-items:center;gap:10px;background:var(--gold-dim);border:1px solid var(--border-md);padding:7px 16px;border-radius:20px;} .nw-footer-badge-mark{width:18px;height:18px;background:var(--gold);border-radius:3px;display:flex;align-items:center;justify-content:center;font-size:8px;font-weight:700;color:#fff;} .nw-footer-badge-lbl{font-size:11px;color:var(--t2);} .nw-footer-badge-domain{font-size:11px;color:var(--gold);font-weight:500;letter-spacing:.04em;} /* Scroll reveal */ .reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease;} .reveal.visible{opacity:1;transform:translateY(0);} /* Spin animation */ @keyframes spin{to{transform:rotate(360deg)}} .spin-icon{animation:spin .9s linear infinite;} /* Responsive */ @media(max-width:1024px){ section{padding:80px 40px;} #hero{grid-template-columns:1fr;padding-top:calc(96px + 60px);} .hero-visual{display:none;} .services-header{grid-template-columns:1fr;} .services-grid{grid-template-columns:1fr 1fr;} #process-home,.process-layout{grid-template-columns:1fr;} #about,.about-grid{grid-template-columns:1fr;} .about-visual-frame{display:none;} .testi-grid{grid-template-columns:1fr;} #contact{grid-template-columns:1fr;} .footer-grid{grid-template-columns:1fr 1fr;} .main-nav{padding:0 24px;} .nav-links{gap:20px;} footer{padding:48px 40px 32px;} .gallery-grid{grid-template-columns:repeat(6,1fr);grid-template-rows:160px 140px;} .g-item:nth-child(n){grid-column:auto;grid-row:auto;}.g-item:nth-child(1){grid-column:1/4;}.g-item:nth-child(2){grid-column:4/7;}.g-item:nth-child(3){grid-column:1/3;grid-row:2;}.g-item:nth-child(4){grid-column:3/5;grid-row:2;}.g-item:nth-child(5){grid-column:5/7;grid-row:2;}.g-item:nth-child(6),.g-item:nth-child(7),.g-item:nth-child(8){display:none;} } @media(max-width:640px){ section{padding:64px 20px;} .main-nav{padding:0 16px;} .nav-links{display:none;} .services-grid{grid-template-columns:1fr;} .form-row{grid-template-columns:1fr;} .footer-grid{grid-template-columns:1fr;gap:32px;} footer{padding:40px 20px 24px;} .nw-sysbar{padding:0 16px;} .hero-stats{gap:28px;} h1{font-size:42px;} .ratings-strip{flex-direction:column;gap:12px;} .ratings-divider{display:none;} } /* ── REAL PORTFOLIO GALLERY ── */ .real-gallery{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:240px;gap:6px;margin-top:8px;} .rg-item{position:relative;overflow:hidden;border-radius:var(--radius);cursor:pointer;} .rg-item img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease;} .rg-item:hover img{transform:scale(1.04);} .rg-wide{grid-column:span 2;}.rg-tall{grid-row:span 2;}.rg-normal{} .rg-overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.55) 0%,transparent 55%);display:flex;align-items:flex-end;padding:14px;opacity:0;transition:opacity .3s;} .rg-item:hover .rg-overlay{opacity:1;} .rg-label{background:rgba(0,0,0,.6);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.12);padding:5px 11px;border-radius:20px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#E8DDD0;} .video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;} .video-card{display:flex;flex-direction:column;gap:10px;} .video-label{font-size:13px;color:var(--t2);font-weight:300;text-align:center;} @media(max-width:1024px){.real-gallery{grid-template-columns:repeat(2,1fr);grid-auto-rows:200px;}.rg-tall{grid-row:span 1;}.video-grid{grid-template-columns:1fr;}} @media(max-width:640px){.real-gallery{grid-template-columns:1fr 1fr;grid-auto-rows:160px;}.rg-wide{grid-column:span 2;}} /* ── HERO LAYOUT FIX ── */ #hero{ display:flex !important; flex-direction:row !important; align-items:center !important; min-height:100vh; padding-top:96px; gap:0; } .hero-content{ flex:0 0 50% !important; width:50% !important; padding:80px 48px 80px 80px; display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2; } .hero-visual{ flex:0 0 50% !important; width:50% !important; height:100vh; max-height:100vh; display:flex !important; align-items:center !important; justify-content:center !important; position:relative; z-index:2; overflow:hidden; padding:96px 40px 40px 0; } .draft-wrap{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; position:relative; } .draft-svg{ width:100%; height:auto; max-height:calc(100vh - 160px); } @media(max-width:1024px){ #hero{flex-direction:column !important;} .hero-content{flex:none !important;width:100% !important;padding:40px 24px;} .hero-visual{flex:none !important;width:100% !important;height:auto;max-height:500px;padding:0 24px 40px;} } /* ══════════════════════════════════════ KITCHEN SVG — SCOPED RULES ONLY ══════════════════════════════════════ */ /* Grid */ .gm{fill:none;stroke:var(--gold);stroke-width:.25;opacity:0;animation:gfade 1s ease .1s forwards;} .gM{fill:none;stroke:var(--gold);stroke-width:.5;opacity:0;animation:gfade 1s ease .3s forwards;} @keyframes gfade{to{opacity:.07;}} [data-theme="light"] .gm,[data-theme="light"] .gM{stroke:#9A6A1A;} /* DRAW classes — scoped to #kitchen-svg to avoid conflicts */ #kitchen-svg .W,#kitchen-svg .L,#kitchen-svg .D, #kitchen-svg .V,#kitchen-svg .H,#kitchen-svg .N, #kitchen-svg .n,#kitchen-svg .K,#kitchen-svg .C, #kitchen-svg .A,#kitchen-svg .S{ fill:none; stroke:var(--gold); stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:var(--dd,800); stroke-dashoffset:var(--dd,800); } #kitchen-svg .W{stroke-width:1.3;} #kitchen-svg .L{stroke-width:1.1;} #kitchen-svg .D{stroke-width:.7;opacity:.65;} #kitchen-svg .V,#kitchen-svg .H{stroke-width:.7;} #kitchen-svg .N{stroke-width:.85;} #kitchen-svg .n{stroke-width:.5;opacity:.7;} #kitchen-svg .K{stroke-width:2.2;} #kitchen-svg .C{stroke-width:.9;} #kitchen-svg .A{stroke-width:1;} #kitchen-svg .S{stroke-width:.8;} /* Labels */ #kitchen-svg .dl,#kitchen-svg .ds,#kitchen-svg .dt,#kitchen-svg .dtitle{opacity:0;} #kitchen-svg .dl{font-family:'DM Sans',sans-serif;font-size:7.5px;fill:var(--gold);letter-spacing:.1em;text-transform:uppercase;} #kitchen-svg .ds{font-family:'DM Sans',sans-serif;font-size:6px;fill:var(--gold);letter-spacing:.08em;text-transform:uppercase;} #kitchen-svg .dt{font-family:'DM Sans',sans-serif;font-size:6.5px;fill:var(--gold);letter-spacing:.06em;} #kitchen-svg .dtitle{font-family:'Cormorant Garamond',serif;font-size:8px;font-weight:600;fill:var(--gold);letter-spacing:.14em;} /* Pencil shape */ .pencil-shape{fill:var(--gold);stroke:none;} /* ── COLOR FILLS — CSS classes only, no inline styles ── */ #color-layer .cf-floor {fill:#C8B898;} #color-layer .cf-plank {fill:none;stroke:#B0A080;stroke-width:.5;} #color-layer .cf-wall {fill:#E8E2D8;} #color-layer .cf-sky {fill:#C8DFF0;} #color-layer .cf-cab {fill:#F0EBE2;} #color-layer .cf-steel {fill:#C8C4BC;} #color-layer .cf-display {fill:#1A2028;} #color-layer .cf-counter {fill:#3A3530;} #color-layer .cf-counter-hi {fill:rgba(255,255,255,0.1);} #color-layer .cf-wood {fill:#8B5E3C;} #color-layer .cf-basin-outer{fill:#B8C0C4;} #color-layer .cf-basin-inner{fill:#A8B0B4;} #color-layer .cf-faucet {fill:#C8B898;} #color-layer .cf-burner {fill:#303030;} #color-layer .cf-burner-c {fill:#505050;} #color-layer .cf-oven {fill:#282828;} #color-layer .cf-hood {fill:#C0BCB4;} #color-layer .cf-handle {fill:#C8A840;} #color-layer .cf-island {fill:#7A4E2C;} #color-layer .cf-island-top {fill:#C8A870;} #color-layer .cf-island-hi {fill:rgba(255,255,255,0.18);} #color-layer .cf-stool {fill:#9A7050;opacity:.85;} #color-layer .cf-pendant {fill:#D4A030;opacity:.95;} #color-layer .cf-pendant-c {fill:#F8D860;opacity:.9;} #color-layer .cf-pendant-wire{fill:none;stroke:#888;stroke-width:1.5;} #color-layer .cf-glow {fill:rgba(248,240,220,0.09);} #color-layer .cf-plant {fill:#5A8A4A;opacity:.8;} #color-layer .cf-pot {fill:#7A5030;} /* Color layer hidden until JS reveals */ #color-layer{opacity:0;transition:opacity 2.5s ease;} #color-layer.revealed{opacity:1;} /* Line art softens when color comes in */ #g-upper.softened,#g-lower.softened,#g-counter.softened, #g-island.softened,#g-hood.softened,#g-corners.softened, #g-title.softened,#dim-layer.softened{opacity:.25;transition:opacity 2s ease;} #grid-layer.faded{opacity:.02;transition:opacity 2s ease;} /* ── DRAW ANIMATIONS — 15 second sequence ── */ @keyframes draw{to{stroke-dashoffset:0;}} #kitchen-svg .W,#kitchen-svg .L,#kitchen-svg .D, #kitchen-svg .V,#kitchen-svg .H,#kitchen-svg .N, #kitchen-svg .n,#kitchen-svg .K,#kitchen-svg .C, #kitchen-svg .A,#kitchen-svg .S{animation:draw 0s linear forwards;} /* DIMS 0.3s */ #dim-layer .D{animation-delay:.3s;animation-duration:1.5s;} #dim-layer .dt{animation:gfade .8s ease .8s forwards;} /* HOOD 1s */ #g-hood .W{animation-delay:1s;animation-duration:.8s;--dd:200;} #g-hood .L{animation-delay:1.3s;animation-duration:.6s;--dd:80;} /* UPPER main box 1.5s */ #g-upper .W:nth-child(1){animation-delay:1.5s;animation-duration:2.5s;--dd:1200;} #g-upper .V:nth-child(2){animation-delay:2.2s;animation-duration:.6s;--dd:85;} #g-upper .V:nth-child(3){animation-delay:2.4s;animation-duration:.6s;--dd:85;} #g-upper .V:nth-child(4){animation-delay:2.6s;animation-duration:.6s;--dd:85;} #g-upper .V:nth-child(5){animation-delay:2.8s;animation-duration:.6s;--dd:85;} /* shaker insets */ #g-upper .N:nth-child(6){animation-delay:3s;animation-duration:.9s;--dd:324;} #g-upper .n:nth-child(7){animation-delay:3.2s;animation-duration:.8s;--dd:292;} #g-upper .N:nth-child(8){animation-delay:3.4s;animation-duration:.9s;--dd:308;} #g-upper .n:nth-child(9){animation-delay:3.6s;animation-duration:.8s;--dd:276;} #g-upper .N:nth-child(10){animation-delay:3.8s;animation-duration:.7s;--dd:212;} #g-upper .N:nth-child(11){animation-delay:3.9s;animation-duration:.7s;--dd:196;} #g-upper .n:nth-child(12){animation-delay:4s;animation-duration:.6s;--dd:180;} #g-upper .n:nth-child(13){animation-delay:4.1s;animation-duration:.6s;--dd:164;} /* microwave */ #g-upper .N:nth-child(14){animation-delay:4.2s;animation-duration:.7s;--dd:284;} #g-upper .n:nth-child(15){animation-delay:4.4s;animation-duration:.6s;--dd:176;} #g-upper .V:nth-child(16){animation-delay:4.5s;animation-duration:.4s;--dd:68;} /* window */ #g-upper .W:nth-child(17){animation-delay:4.6s;animation-duration:.9s;--dd:368;} #g-upper .V:nth-child(18){animation-delay:5s;animation-duration:.5s;--dd:76;} #g-upper .H:nth-child(19){animation-delay:5.2s;animation-duration:.5s;--dd:108;} #g-upper .V:nth-child(20){animation-delay:5.4s;animation-duration:.4s;--dd:38;} #g-upper .V:nth-child(21){animation-delay:5.5s;animation-duration:.4s;--dd:38;} /* handles */ #g-upper .K:nth-child(22){animation-delay:5.6s;animation-duration:.4s;--dd:42;} #g-upper .K:nth-child(23){animation-delay:5.7s;animation-duration:.4s;--dd:36;} #g-upper .K:nth-child(24){animation-delay:5.8s;animation-duration:.4s;--dd:20;} #g-upper .K:nth-child(25){animation-delay:5.9s;animation-duration:.4s;--dd:20;} #g-upper .dl:nth-child(26){animation:gfade .4s ease 6s forwards;} #g-upper .dl:nth-child(27){animation:gfade .4s ease 6.1s forwards;} #g-upper .dl:nth-child(28){animation:gfade .4s ease 6.2s forwards;} #g-upper .dl:nth-child(29){animation:gfade .4s ease 6.3s forwards;} #g-upper .dl:nth-child(30){animation:gfade .4s ease 6.4s forwards;} /* COUNTER 6.5s */ #g-counter .W{animation-delay:6.5s;animation-duration:1.2s;--dd:1060;} #g-counter .L{animation-delay:6.9s;animation-duration:.8s;--dd:512;} #g-counter .ds{animation:gfade .4s ease 7.2s forwards;} /* LOWER 7.4s */ #g-lower .W:nth-child(1){animation-delay:7.4s;animation-duration:1.4s;--dd:1220;} #g-lower .V:nth-child(2){animation-delay:7.8s;animation-duration:.5s;--dd:106;} #g-lower .V:nth-child(3){animation-delay:7.9s;animation-duration:.5s;--dd:106;} #g-lower .V:nth-child(4){animation-delay:8s;animation-duration:.5s;--dd:106;} #g-lower .V:nth-child(5){animation-delay:8.1s;animation-duration:.5s;--dd:106;} #g-lower .V:nth-child(6){animation-delay:8.2s;animation-duration:.5s;--dd:106;} #g-lower .N:nth-child(7){animation-delay:8.3s;animation-duration:.7s;--dd:344;} #g-lower .n:nth-child(8){animation-delay:8.5s;animation-duration:.6s;--dd:312;} #g-lower .N:nth-child(9){animation-delay:8.7s;animation-duration:.7s;--dd:324;} #g-lower .n:nth-child(10){animation-delay:8.9s;animation-duration:.6s;--dd:294;} #g-lower .N:nth-child(11){animation-delay:9s;animation-duration:.6s;--dd:368;} #g-lower .N:nth-child(12){animation-delay:9.1s;animation-duration:.6s;--dd:264;} #g-lower .n:nth-child(13){animation-delay:9.2s;animation-duration:.5s;--dd:232;} #g-lower .C:nth-child(14){animation-delay:9.3s;animation-duration:.4s;--dd:58;} #g-lower .C:nth-child(15){animation-delay:9.4s;animation-duration:.3s;--dd:22;} #g-lower .K:nth-child(16){animation-delay:9.5s;animation-duration:.3s;--dd:12;} #g-lower .A:nth-child(17){animation-delay:9.6s;animation-duration:.3s;--dd:44;} #g-lower .C:nth-child(18){animation-delay:9.7s;animation-duration:.3s;--dd:20;} #g-lower .C:nth-child(19){animation-delay:9.8s;animation-duration:.3s;--dd:20;} #g-lower .N:nth-child(20){animation-delay:9.9s;animation-duration:.6s;--dd:324;} #g-lower .n:nth-child(21){animation-delay:10s;animation-duration:.5s;--dd:292;} #g-lower .N:nth-child(22){animation-delay:10.1s;animation-duration:.6s;--dd:272;} #g-lower .H:nth-child(23){animation-delay:10.3s;animation-duration:.4s;--dd:46;} #g-lower .H:nth-child(24){animation-delay:10.4s;animation-duration:.4s;--dd:46;} #g-lower .N:nth-child(25){animation-delay:10.5s;animation-duration:.6s;--dd:320;} #g-lower .C:nth-child(26){animation-delay:10.7s;animation-duration:.3s;--dd:52;} #g-lower .C:nth-child(27){animation-delay:10.75s;animation-duration:.25s;--dd:22;} #g-lower .C:nth-child(28){animation-delay:10.8s;animation-duration:.3s;--dd:52;} #g-lower .C:nth-child(29){animation-delay:10.85s;animation-duration:.25s;--dd:22;} #g-lower .C:nth-child(30){animation-delay:10.9s;animation-duration:.3s;--dd:52;} #g-lower .C:nth-child(31){animation-delay:10.95s;animation-duration:.25s;--dd:22;} #g-lower .C:nth-child(32){animation-delay:11s;animation-duration:.3s;--dd:52;} #g-lower .C:nth-child(33){animation-delay:11.05s;animation-duration:.25s;--dd:22;} #g-lower .N:nth-child(34){animation-delay:11.1s;animation-duration:.5s;--dd:180;} #g-lower .K:nth-child(35){animation-delay:11.3s;animation-duration:.4s;--dd:42;} #g-lower .K:nth-child(36){animation-delay:11.4s;animation-duration:.4s;--dd:42;} #g-lower .K:nth-child(37){animation-delay:11.5s;animation-duration:.4s;--dd:38;} #g-lower .dl{animation:gfade .4s ease 11.6s forwards;} /* TOE KICK 11.7s */ .L.dda{animation-delay:11.7s;animation-duration:.5s;--dd:466;} /* FLOOR 12s */ .L.dda:last-of-type{animation-delay:12s;animation-duration:1s;--dd:566;} /* ISLAND 12.5s */ #g-island .W{animation-delay:12.5s;animation-duration:.7s;--dd:560;} #g-island .L:nth-child(2){animation-delay:12.7s;animation-duration:.5s;--dd:288;} #g-island .H:nth-child(3){animation-delay:12.8s;animation-duration:.5s;--dd:288;} #g-island .V:nth-child(4){animation-delay:12.9s;animation-duration:.4s;--dd:56;} #g-island .V:nth-child(5){animation-delay:12.95s;animation-duration:.4s;--dd:56;} #g-island .V:nth-child(6){animation-delay:13s;animation-duration:.35s;--dd:44;} #g-island .V:nth-child(7){animation-delay:13.05s;animation-duration:.35s;--dd:44;} #g-island .V:nth-child(8){animation-delay:13.1s;animation-duration:.35s;--dd:44;} #g-island .N:nth-child(9){animation-delay:13.15s;animation-duration:.4s;--dd:172;} #g-island .N:nth-child(10){animation-delay:13.25s;animation-duration:.4s;--dd:172;} #g-island .N:nth-child(11){animation-delay:13.35s;animation-duration:.4s;--dd:172;} #g-island .N:nth-child(12){animation-delay:13.45s;animation-duration:.4s;--dd:172;} #g-island .K:nth-child(13){animation-delay:13.5s;animation-duration:.3s;--dd:28;} #g-island .K:nth-child(14){animation-delay:13.55s;animation-duration:.3s;--dd:28;} #g-island .K:nth-child(15){animation-delay:13.6s;animation-duration:.3s;--dd:28;} #g-island .K:nth-child(16){animation-delay:13.65s;animation-duration:.3s;--dd:28;} #g-island .L:nth-child(17){animation-delay:13.7s;animation-duration:.4s;--dd:288;} #g-island .S:nth-child(18){animation-delay:13.8s;animation-duration:.35s;--dd:82;} #g-island .S:nth-child(19){animation-delay:13.85s;animation-duration:.35s;--dd:82;} #g-island .S:nth-child(20){animation-delay:13.9s;animation-duration:.35s;--dd:82;} #g-island .S:nth-child(21){animation-delay:13.95s;animation-duration:.35s;--dd:82;} #g-island .C:nth-child(22){animation-delay:14s;animation-duration:.35s;--dd:70;} #g-island .C:nth-child(23){animation-delay:14.1s;animation-duration:.3s;--dd:32;} #g-island .K:nth-child(24){animation-delay:14.15s;animation-duration:.3s;--dd:26;} #g-island .C:nth-child(25){animation-delay:14.2s;animation-duration:.35s;--dd:70;} #g-island .C:nth-child(26){animation-delay:14.3s;animation-duration:.3s;--dd:32;} #g-island .K:nth-child(27){animation-delay:14.35s;animation-duration:.3s;--dd:26;} #g-island .D{animation-delay:14.4s;animation-duration:.6s;--dd:290;} #g-island .dt{animation:gfade .4s ease 14.6s forwards;} #g-island .dl{animation:gfade .4s ease 14.7s forwards;} /* CORNERS 14.7s */ #g-corners .L:nth-child(1){animation-delay:14.7s;animation-duration:.35s;--dd:38;} #g-corners .L:nth-child(2){animation-delay:14.75s;animation-duration:.35s;--dd:46;} #g-corners .L:nth-child(3){animation-delay:14.8s;animation-duration:.35s;--dd:38;} #g-corners .L:nth-child(4){animation-delay:14.85s;animation-duration:.35s;--dd:46;} /* TITLE 14.9s */ #g-title .W{animation-delay:14.9s;animation-duration:.5s;--dd:384;} #g-title .H{animation-delay:15s;animation-duration:.35s;--dd:164;} #g-title .dtitle{animation:gfade .4s ease 15.1s forwards;} #g-title .dt:nth-child(3){animation:gfade .4s ease 15.2s forwards;} #g-title .dt:nth-child(4){animation:gfade .4s ease 15.3s forwards;} #g-title .dt:nth-child(5){animation:gfade .4s ease 15.4s forwards;} /* BADGE */ .draft-badge{ position:absolute;bottom:14px;right:14px; display:flex;align-items:center;gap:6px; background:var(--gold-dim);border:1px solid var(--border-md); padding:6px 12px;border-radius:20px; font-size:10px;color:var(--gold);letter-spacing:.1em;text-transform:uppercase;font-weight:500; opacity:0;animation:gfade .8s ease 15s forwards; } /* PENCIL CURSOR */ #pencil{animation:pencil-trace 15s ease-in-out forwards;transform-origin:5px 7px;} @keyframes pencil-trace{ 0% {transform:translate(25px,18px) rotate(-30deg);opacity:0;} 2% {opacity:1;} 6% {transform:translate(528px,18px) rotate(-30deg);} 10% {transform:translate(478px,27px) rotate(-20deg);} 13% {transform:translate(25px,43px) rotate(-25deg);} 18% {transform:translate(528px,125px) rotate(-10deg);} 20% {transform:translate(22px,130px) rotate(-15deg);} 24% {transform:translate(534px,144px) rotate(-5deg);} 26% {transform:translate(22px,148px) rotate(-20deg);} 40% {transform:translate(534px,248px) rotate(-8deg);} 43% {transform:translate(22px,252px) rotate(-12deg);} 47% {transform:translate(0px,345px) rotate(-8deg);} 51% {transform:translate(560px,345px) rotate(-5deg);} 55% {transform:translate(134px,282px) rotate(-18deg);} 68% {transform:translate(422px,342px) rotate(-12deg);} 73% {transform:translate(174px,350px) rotate(-20deg);} 79% {transform:translate(390px,350px) rotate(-20deg);} 83% {transform:translate(210px,220px) rotate(-28deg);} 87% {transform:translate(342px,220px) rotate(-28deg);} 91% {transform:translate(390px,384px) rotate(-15deg);} 96% {transform:translate(555px,412px) rotate(-5deg);} 98% {opacity:1;} 100%{transform:translate(560px,420px) rotate(-5deg);opacity:0;} }