:root{--orange:#e8620a;--orange-dark:#c94e00;--ink:#17130d;--cream:#f6f2ea;--muted:#706a61}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:Outfit,Arial,sans-serif;font-size:16px}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}.site-header{position:relative;z-index:20;border-bottom:1px solid #00000018;background:#f6f2eaf2;backdrop-filter:blur(18px)}.header-inner{height:80px;max-width:1440px;margin:auto;padding:0 48px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px}.brand>span:last-child{line-height:1}.brand strong{display:block;font-size:18px;letter-spacing:.18em}.brand small{display:block;margin-top:4px;color:#777;font-size:10px;letter-spacing:.24em}.logo-mark{display:grid;place-items:center;width:42px;height:42px;border:2px solid var(--orange);color:var(--orange);font-family:Georgia,serif;font-weight:700;letter-spacing:-.08em}.desktop-nav{display:flex;gap:32px;font-size:14px;font-weight:500}.desktop-nav a:hover,.mobile-nav a:hover{color:var(--orange)}.header-actions{display:flex;align-items:center;gap:10px}.phone-link{margin-right:8px;font-size:14px;font-weight:500}.language-switch{display:flex;padding:3px;border:1px solid #0002;border-radius:99px}.language-switch button{border:0;background:none;border-radius:99px;padding:6px 8px;font-size:12px;cursor:pointer}.language-switch button.active{background:var(--ink);color:#fff}.login-btn,.primary-btn,.secondary-btn,.light-btn,.submit-btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:99px;cursor:pointer;font-weight:500}.login-btn{min-height:44px;padding:0 24px;background:var(--ink);color:#fff}.login-btn:hover,.primary-btn:hover{background:var(--orange-dark)}.menu-btn{display:none;border:1px solid #0002;border-radius:50%;background:none;width:42px;height:42px}.mobile-nav{display:none}.hero{max-width:1440px;min-height:calc(100vh - 80px);margin:auto;display:grid;grid-template-columns:.92fr 1.08fr}.hero-copy{display:flex;flex-direction:column;justify-content:center;padding:88px 48px}.eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 32px;color:var(--orange-dark);font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase}.eyebrow:before{content:"";width:36px;height:1px;background:var(--orange)}h1{max-width:650px;margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(3.5rem,7vw,7.4rem);font-weight:500;line-height:.84;letter-spacing:-.055em}h1 em{color:var(--orange);font-weight:300}.intro{max-width:520px;margin:32px 0 0;color:#686159;font-size:18px;line-height:1.65}.hero-buttons{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}.primary-btn,.secondary-btn{min-height:52px;padding:0 28px}.primary-btn{background:var(--orange);color:#fff}.secondary-btn{border:1px solid #0003;background:transparent}.secondary-btn:hover{background:#fff9}.stats{max-width:575px;margin-top:54px;padding-top:26px;border-top:1px solid #0002;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.stats strong{display:block;font-family:"Cormorant Garamond",Georgia,serif;font-size:32px}.stats span{display:block;margin-top:4px;color:#777;font-size:12px;letter-spacing:.08em;text-transform:uppercase}.hero-image{position:relative;min-height:600px;overflow:hidden}.hero-image>img{width:100%;height:100%;object-fit:cover;display:block}.hero-image:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,#0009,transparent 55%)}.zone-card{position:absolute;z-index:2;bottom:36px;left:36px;width:390px;padding:24px;border:1px solid #ffffff40;border-radius:24px;background:#0006;color:#fff;backdrop-filter:blur(18px)}.zone-label,.section-label{font-size:12px;letter-spacing:.2em;text-transform:uppercase}.zone-label{color:#ffffffaa}.zone-card h2{margin:8px 0;font-family:"Cormorant Garamond",Georgia,serif;font-size:27px;font-weight:500}.zone-card p{margin:0;color:#ffffffc0;font-size:14px;line-height:1.55}.light-btn{min-height:40px;margin-top:20px;padding:0 20px;background:#fff;color:var(--ink)}.products{padding:64px 48px;background:var(--ink);color:#fff}.section-inner{max-width:1344px;margin:auto}.section-label{margin:0 0 20px;color:#ef7b32;font-weight:600}.product-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #ffffff28}.product-grid a{display:flex;align-items:center;justify-content:space-between;padding:24px;border-bottom:1px solid #ffffff28;font-size:24px}.product-grid a:nth-child(odd){border-right:1px solid #ffffff28}.product-grid a:hover{color:#ef7b32}.product-grid small{margin-right:20px;color:#ffffff55;font-size:12px}.product-grid b{font-weight:400}.modal[hidden]{display:none}.modal{position:fixed;z-index:100;inset:0;display:grid;place-items:center;padding:16px}.modal-backdrop{position:absolute;inset:0;background:#0009;backdrop-filter:blur(4px)}.modal-card{position:relative;width:min(440px,100%);overflow:hidden;border-radius:28px;background:#fff;box-shadow:0 30px 90px #0005}.modal-accent{height:7px;background:linear-gradient(90deg,var(--orange) 0 62%,var(--ink) 62%)}.modal-close{position:absolute;right:16px;top:17px;border:0;background:none;font-size:28px;color:#777;cursor:pointer}.modal-body{padding:36px}.modal-icon{display:grid;place-items:center;width:44px;height:44px;margin-bottom:20px;border-radius:50%;background:#fff0e7;color:var(--orange);font-size:20px}.modal h2{margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-size:32px}.modal p{color:#6f6a64;line-height:1.5}.modal label{display:block;margin:24px 0 8px;font-size:14px;font-weight:500}.modal input,.installer input,.installer select{width:100%;height:52px;border:1px solid #ccc4b9;border-radius:12px;background:#fff;padding:0 14px;outline:none}.modal input:focus,.installer input:focus,.installer select:focus{border-color:var(--orange);box-shadow:0 0 0 3px #e8620a22}.submit-btn{width:100%;min-height:52px;margin-top:16px;background:var(--orange);color:#fff}.submit-btn:disabled{opacity:.55}.modal small{display:block;margin-top:16px;text-align:center;color:#777;line-height:1.45}.code-input{text-align:center;font-size:24px;letter-spacing:.45em}.text-btn{width:100%;margin-top:14px;border:0;background:none;color:#777;cursor:pointer}.form-error{color:#bd1717!important;font-size:14px}.done-step{text-align:center}.success-icon{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 20px;border-radius:50%;background:#ecf9f0;color:#148442;font-size:30px}.link-button{box-sizing:border-box}.modal-open{overflow:hidden}.installer{min-height:100vh;display:grid;place-items:center;padding:24px;background:#ece7dd}.install-card{width:min(620px,100%);padding:40px;border-radius:28px;background:#fff;box-shadow:0 20px 70px #0002}.install-card h1{margin-top:32px;font-size:42px}.install-card>p{color:#706a61;line-height:1.6}.installer label{display:block;margin-top:16px;font-size:14px;font-weight:500}.installer input,.installer select{margin-top:7px}.form-grid{display:grid;grid-template-columns:2fr 1fr;gap:14px}.installer hr{margin:28px 0 8px;border:0;border-top:1px solid #ddd}.installer button{width:100%;height:54px;margin-top:24px;border:0;border-radius:14px;background:var(--orange);color:#fff;font-weight:600;cursor:pointer}.install-error{margin:20px 0;padding:14px;border-radius:12px;background:#fff0f0;color:#a11212}.install-note{font-size:13px}.account-page{min-height:100vh;padding:40px 20px}.account-shell{max-width:980px;margin:auto}.account-head{display:flex;align-items:end;justify-content:space-between;margin:70px 0 28px}.account-head p{margin:0;color:#777}.account-head h1{margin-top:5px;font-size:46px}.account-card{padding:30px;border-radius:24px;background:#fff}.account-card h2{margin-top:0}.empty-state{padding:36px;border:1px dashed #ccc;border-radius:16px;color:#777;text-align:center}.project-row{display:grid;grid-template-columns:160px 1fr 120px;gap:20px;padding:18px 0;border-top:1px solid #eee}.project-row small{text-align:right}
@media(max-width:1000px){.desktop-nav,.phone-link{display:none}.header-inner{padding:0 28px}.hero{grid-template-columns:1fr}.hero-copy{padding:70px 28px}.hero-image{min-height:620px}.products{padding:58px 28px}}
@media(max-width:680px){.header-inner{height:72px;padding:0 18px}.header-actions>.language-switch{display:flex}.header-actions>.login-btn{display:none}.menu-btn{display:block}.mobile-nav.open{display:grid;gap:16px;padding:20px;border-top:1px solid #0002}.hero-copy{padding:54px 20px}.hero{min-height:0}.hero-image{min-height:560px}.zone-card{left:18px;right:18px;bottom:22px;width:auto}.stats{grid-template-columns:1fr 1fr}.stats div:last-child{grid-column:1/-1}.products{padding:50px 20px}.product-grid{grid-template-columns:1fr}.product-grid a:nth-child(odd){border-right:0}.modal-body{padding:30px 24px}.form-grid{grid-template-columns:1fr}.install-card{padding:28px 20px}.account-head{align-items:start;flex-direction:column;gap:20px}.project-row{grid-template-columns:1fr;gap:5px}.project-row small{text-align:left}}

/* JK UNIS logo v2 - compact header treatment */
.brand-with-image{gap:9px}
.brand-logo{display:block;object-fit:contain;flex:0 0 auto}
.site-header .brand-logo{width:38px;height:38px;max-width:none}.account-top .brand-logo,.admin-header .brand-logo{width:40px;height:40px;max-width:none}
.brand-context{display:block;color:#777;font-size:9px;font-weight:600;letter-spacing:.16em;line-height:1.15;text-transform:uppercase;white-space:nowrap}
.footer-brand .brand-logo{width:88px;height:auto;max-width:none}
.footer-logo{align-items:flex-start}
@media(max-width:600px){.site-header .brand-logo{width:34px;height:34px}.account-top .brand-logo,.admin-header .brand-logo{width:36px;height:36px}.brand-context{font-size:8px;letter-spacing:.12em}.footer-brand .brand-logo{width:70px;height:auto}}

/* Hidden form steps and modal must remain hidden even when layout rules set display. */
[hidden], .modal[hidden], .modal form[hidden], .modal .done-step[hidden] { display: none !important; }
@media (max-width: 680px) { .modal { padding: 12px; align-items: center; } .modal-card { max-height: calc(100dvh - 24px); overflow-y: auto; border-radius: 18px; } .modal-body { padding: 28px 20px 24px; } .modal input { font-size: 16px; } }
