
:root{
  --cp-bg:#f4efeb;
  --cp-paper:#fffdfa;
  --cp-ink:#2b2124;
  --cp-muted:#88797d;
  --cp-rose:#b77d89;
  --cp-rose-soft:#f7e8e7;
  --cp-gold:#b18a53;
  --cp-line:#eaded8;
  --cp-green:#288657;
  --cp-red:#b54e59;
  --cp-serif:"Cormorant Garamond",serif;
  --cp-sans:"Montserrat",sans-serif;
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--cp-sans);color:var(--cp-ink);background:var(--cp-bg)}
a{text-decoration:none;color:inherit}
.customer-brand{display:flex;align-items:center;gap:11px}
.customer-brand>span{width:43px;height:43px;display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;font:700 24px var(--cp-serif)}
.customer-brand strong{display:block;font:700 25px/1 var(--cp-serif)}
.customer-brand small{display:block;margin-top:5px;font-size:6px;letter-spacing:.2em}
.customer-brand.light{color:#fff}
.customer-brand.dark{color:var(--cp-ink)}
.customer-eyebrow{font-size:7px;letter-spacing:.17em;font-weight:800;color:var(--cp-rose)}
.customer-login-shell{min-height:100dvh;display:grid;grid-template-columns:1.05fr .95fr}
.customer-login-visual{position:relative;overflow:hidden;padding:45px 5vw;display:flex;flex-direction:column;justify-content:space-between;background:radial-gradient(circle at 85% 15%,rgba(255,255,255,.08),transparent 25%),#2d2326;color:#fff}
.customer-login-visual:after{content:"H";position:absolute;right:-60px;bottom:-170px;font:700 430px/1 var(--cp-serif);color:rgba(255,255,255,.025)}
.customer-login-copy{position:relative;z-index:1;max-width:690px}
.customer-login-copy>span{font-size:7px;letter-spacing:.2em;color:#ddb0b9}
.customer-login-copy h1{margin:17px 0 20px;font:600 clamp(54px,6vw,96px)/.85 var(--cp-serif);letter-spacing:-.055em}
.customer-login-copy p{max-width:580px;margin:0;font-size:9px;line-height:1.8;color:rgba(255,255,255,.62)}
.customer-login-benefits{position:relative;z-index:1;display:flex;gap:25px;flex-wrap:wrap}
.customer-login-benefits span{font-size:7px;color:rgba(255,255,255,.65)}
.customer-login-form-side{position:relative;padding:40px 7vw;display:flex;align-items:center;justify-content:center;background:var(--cp-bg)}
.mobile-brand{display:none}
.customer-login-card{width:min(100%,480px);padding:38px;border:1px solid var(--cp-line);border-radius:28px;background:var(--cp-paper);box-shadow:0 32px 90px rgba(48,31,36,.10)}
.customer-login-card h2{margin:10px 0 9px;font:600 43px/.95 var(--cp-serif)}
.customer-login-card>p{margin:0 0 24px;font-size:8px;line-height:1.65;color:var(--cp-muted)}
.customer-alert{margin-bottom:15px;padding:12px 14px;border:1px solid #f0cfd2;border-radius:12px;background:#fff1f2;color:#9e414d;font-size:8px}
.customer-login-form{display:grid;gap:13px}
.customer-login-form label>span{display:block;margin:0 0 7px 3px;font-size:7px;font-weight:700;color:#79696d}
.customer-login-form input{width:100%;height:54px;padding:0 15px;border:1px solid var(--cp-line);border-radius:14px;background:#fff;font:500 10px var(--cp-sans);outline:0}
.customer-login-form input:focus{border-color:#b9838f;box-shadow:0 0 0 4px rgba(185,131,143,.09)}
.customer-login-form button{height:55px;margin-top:4px;padding:0 10px 0 18px;display:flex;align-items:center;justify-content:space-between;border:0;border-radius:15px;background:#2d2326;color:#fff;font:800 8px var(--cp-sans);cursor:pointer}
.customer-login-form button b{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:#fff;color:#2d2326;font-size:15px}
.customer-help{margin-top:22px;padding-top:18px;border-top:1px solid var(--cp-line);display:flex;justify-content:space-between;gap:10px;font-size:7px}
.customer-help span{color:var(--cp-muted)}
.customer-help a{font-weight:800;color:#805862}

.customer-panel-header{position:sticky;top:0;z-index:100;min-height:82px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;gap:25px;border-bottom:1px solid rgba(49,34,38,.08);background:rgba(255,253,250,.93);backdrop-filter:blur(18px)}
.customer-panel-header nav{display:flex;gap:25px}
.customer-panel-header nav a{font-size:7px;font-weight:700;color:#817277}
.customer-panel-header nav a.active{color:var(--cp-ink)}
.customer-logout{min-height:40px;padding:0 14px;display:flex;align-items:center;border:1px solid var(--cp-line);border-radius:12px;font-size:7px;font-weight:800}
.customer-panel{max-width:1250px;margin:auto;padding:52px 24px 100px}
.customer-welcome{display:flex;justify-content:space-between;gap:25px;align-items:flex-end;margin-bottom:23px}
.customer-welcome h1{margin:8px 0 6px;font:600 clamp(43px,5vw,70px)/.9 var(--cp-serif);letter-spacing:-.045em}
.customer-welcome p{margin:0;font-size:8px;color:var(--cp-muted)}
.customer-code{text-align:right}
.customer-code span{display:block;font-size:6px;letter-spacing:.16em;color:var(--cp-muted)}
.customer-code strong{display:block;margin-top:7px;font-size:11px;color:#8c626b}
.customer-status-card{min-height:150px;padding:24px;display:grid;grid-template-columns:58px 1fr auto;gap:18px;align-items:center;border:1px solid var(--cp-line);border-radius:24px;background:var(--cp-paper)}
.status-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:18px;background:#fff2e1;color:#a06d28;font-size:25px;font-weight:800}
.status-confirmed .status-icon,.status-completed .status-icon{background:#e7f6ed;color:var(--cp-green)}
.status-cancelled .status-icon{background:#fdebed;color:var(--cp-red)}
.customer-status-card span{font-size:6px;letter-spacing:.15em;color:var(--cp-muted)}
.customer-status-card h2{margin:7px 0 6px;font:600 32px/.95 var(--cp-serif)}
.customer-status-card p{max-width:690px;margin:0;font-size:8px;line-height:1.65;color:var(--cp-muted)}
.days-counter{min-width:95px;text-align:center;padding:14px;border-left:1px solid var(--cp-line)}
.days-counter strong{display:block;font:600 35px/.9 var(--cp-serif)}
.days-counter span{display:block;margin-top:6px}
.customer-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:14px 0}
.customer-metrics article{min-height:130px;padding:21px;border:1px solid var(--cp-line);border-radius:21px;background:var(--cp-paper)}
.customer-metrics span{font-size:7px;color:var(--cp-muted)}
.customer-metrics strong{display:block;margin-top:18px;font:600 34px/.9 var(--cp-serif)}
.customer-metrics small{display:block;margin-top:8px;font-size:6.5px;color:var(--cp-muted)}
.customer-metrics .remaining{background:#2d2326;color:#fff;border-color:#2d2326}
.customer-metrics .remaining span,.customer-metrics .remaining small{color:rgba(255,255,255,.58)}
.customer-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:14px}
.customer-card{padding:23px;border:1px solid var(--cp-line);border-radius:23px;background:var(--cp-paper)}
.customer-card-head{display:flex;justify-content:space-between;gap:15px;align-items:flex-start;margin-bottom:18px}
.customer-card-head h2{margin:6px 0 0;font:600 29px/.95 var(--cp-serif)}
.customer-date-badge{width:58px;height:58px;display:grid;place-items:center;align-content:center;border-radius:17px;background:#2d2326;color:#fff}
.customer-date-badge strong{font:600 25px/.85 var(--cp-serif)}
.customer-date-badge small{margin-top:4px;font-size:6px;color:rgba(255,255,255,.6)}
.customer-detail-list{margin:0}
.customer-detail-list div{display:grid;grid-template-columns:145px 1fr;gap:15px;padding:10px 0;border-bottom:1px dotted #ded1cb}
.customer-detail-list div:last-child{border-bottom:0}
.customer-detail-list dt{font-size:7px;color:var(--cp-muted)}
.customer-detail-list dd{margin:0;font-size:8px;font-weight:700}
.bank-box{padding:17px;border:1px solid #ead8a7;border-radius:16px;background:#fff8e5}
.bank-box span{display:block;font-size:6px;letter-spacing:.11em;color:#96722f}
.bank-box strong{display:block;margin:11px 0 8px;font-size:10px;line-height:1.5;overflow-wrap:anywhere}
.bank-box small{font-size:6.5px;line-height:1.5;color:#8b7750}
.customer-primary-action{min-height:49px;margin-top:12px;padding:0 15px;display:flex;align-items:center;justify-content:space-between;border-radius:14px;background:#2d2326;color:#fff;font-size:7px;font-weight:800}
.customer-notes{margin-top:14px}
.customer-note-list{display:grid;gap:8px}
.customer-note-list p{margin:0;padding:10px 12px;border-radius:11px;background:#f8f3f0;font-size:7.5px}
.customer-actions-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
.customer-actions-grid a{min-height:135px;padding:20px;display:grid;grid-template-columns:1fr auto;align-content:start;border:1px solid var(--cp-line);border-radius:22px;background:var(--cp-paper)}
.customer-actions-grid a>span{grid-column:1/-1;font-size:6px;color:var(--cp-rose)}
.customer-actions-grid strong{display:block;margin-top:20px;font:600 25px/.95 var(--cp-serif)}
.customer-actions-grid small{grid-column:1;display:block;margin-top:8px;font-size:7px;line-height:1.55;color:var(--cp-muted)}
.customer-actions-grid b{grid-column:2;grid-row:2/4;align-self:center;font-size:20px;color:#9f7b83}
.customer-mobile-nav{display:none}

.customer-contract-toolbar{position:sticky;top:0;z-index:20;padding:11px;display:flex;justify-content:center;gap:9px;background:rgba(45,35,38,.95)}
.customer-contract-toolbar a,.customer-contract-toolbar button{min-height:40px;padding:0 15px;border:0;border-radius:11px;background:#fff;color:#2d2326;font:800 7px var(--cp-sans);display:flex;align-items:center;cursor:pointer}
.customer-contract-toolbar button{background:#d9a7b1}
.customer-contract-paper{width:210mm;min-height:297mm;margin:20px auto;padding:14mm;background:var(--cp-paper);box-shadow:0 25px 75px rgba(48,31,36,.12)}
.customer-contract-paper>header{display:flex;justify-content:space-between;align-items:center;padding-bottom:8mm;border-bottom:1px solid var(--cp-line)}
.customer-contract-paper>header>div:last-child{text-align:right}
.customer-contract-paper>header>div:last-child span{display:block;font-size:6px;color:var(--cp-muted)}
.customer-contract-paper>header>div:last-child strong{display:block;margin-top:5px;font-size:9px;color:var(--cp-gold)}
.customer-contract-title{text-align:center;padding:12mm 0 8mm}
.customer-contract-title>span{font-size:6px;letter-spacing:.17em;color:var(--cp-gold)}
.customer-contract-title h1{margin:7px 0;font:600 28px/1 var(--cp-serif)}
.customer-contract-title p{margin:0;font-size:7px;color:var(--cp-muted)}
.customer-contract-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:3mm;margin-bottom:8mm}
.customer-contract-meta div{padding:4mm;border:1px solid var(--cp-line);border-radius:12px}
.customer-contract-meta span{display:block;font-size:6px;color:var(--cp-muted)}
.customer-contract-meta strong{display:block;margin-top:2mm;font-size:7.5px}
.customer-contract-text{font-size:8px;line-height:1.65}
.customer-contract-paper footer{display:flex;justify-content:space-between;margin-top:8mm;padding-top:3mm;border-top:1px solid var(--cp-line);font-size:6px;color:var(--cp-muted)}
.header-customer-login{font-size:7px;font-weight:800;color:#66565a}
.mobile-customer-actions{display:flex;gap:8px;align-items:center}
.mobile-customer-actions>a:first-child{padding:12px 13px;border-radius:13px;background:#fff;color:#2d2326;font-size:7px;font-weight:800}

@media(max-width:900px){
  .customer-login-shell{grid-template-columns:1fr}
  .customer-login-visual{min-height:340px;padding:25px 20px}
  .customer-login-copy h1{font-size:52px}
  .customer-login-form-side{padding:25px 16px 50px}
  .mobile-brand{display:flex;margin-bottom:20px}
  .customer-login-form-side{display:block}
  .customer-login-card{margin:auto;padding:27px 20px}
  .customer-panel-header{padding:0 13px}
  .customer-panel-header nav{display:none}
  .customer-panel-header .customer-brand strong{font-size:20px}
  .customer-panel-header .customer-brand>span{width:36px;height:36px;font-size:19px}
  .customer-panel{padding:35px 12px 90px}
  .customer-grid{grid-template-columns:1fr}
}
@media(max-width:650px){
  .customer-login-visual{min-height:310px}
  .customer-login-copy h1{font-size:45px}
  .customer-login-benefits{gap:12px}
  .customer-welcome{display:block}
  .customer-code{text-align:left;margin-top:18px}
  .customer-status-card{grid-template-columns:48px 1fr}
  .status-icon{width:48px;height:48px;border-radius:15px}
  .days-counter{grid-column:1/-1;width:100%;padding:13px;border-left:0;border-top:1px solid var(--cp-line);display:flex;gap:8px;align-items:center;justify-content:center}
  .days-counter strong{font-size:26px}
  .days-counter span{margin:0}
  .customer-metrics{grid-template-columns:1fr 1fr}
  .customer-metrics .remaining{grid-column:1/-1}
  .customer-metrics article{min-height:112px;padding:16px}
  .customer-metrics strong{font-size:29px}
  .customer-detail-list div{grid-template-columns:1fr;gap:5px}
  .customer-actions-grid{grid-template-columns:1fr}
  .customer-mobile-nav{position:fixed;z-index:1000;left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));min-height:64px;padding:7px;display:grid;grid-template-columns:repeat(3,1fr);gap:5px;border:1px solid var(--cp-line);border-radius:20px;background:rgba(255,253,250,.95);box-shadow:0 18px 50px rgba(45,31,35,.18);backdrop-filter:blur(18px)}
  .customer-mobile-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border-radius:13px;color:#77676b}
  .customer-mobile-nav a.active{background:#2d2326;color:#fff}
  .customer-mobile-nav span{font-size:15px}
  .customer-mobile-nav small{font-size:5.5px;font-weight:800}
  .customer-contract-paper{width:100%;margin:0;padding:20px;box-shadow:none}
  .customer-contract-meta{grid-template-columns:1fr 1fr}
}
@media print{
  @page{size:A4;margin:0}
  body{background:#fff}
  .no-print{display:none!important}
  .customer-contract-paper{width:210mm;margin:0;padding:12mm 14mm;box-shadow:none}
  .customer-contract-meta div{break-inside:avoid}
}
