/* CaknaQurban Unified Page System · 2026-10-04
   Three shared classes only: .cq-page, .cq-page-standard and .cq-page-wide. */
:root{
 --cq-canvas:#f0f5fa;--cq-panel:#fff;--cq-ink:#173f3a;--cq-muted:#60766f;
 --cq-border:#d7e4e8;--cq-green:#146b58;--cq-blue:#124c68;--cq-gold:#e8aa3c;
 --cq-radius:18px;--cq-shadow:0 8px 26px #17496b0d;
}
.cq-page{margin:0;background:var(--cq-canvas);color:var(--cq-ink);min-width:0;}
.cq-page *{box-sizing:border-box;}
.cq-page>main,.cq-page main.comm-shell{width:100%;margin:0 auto;padding:24px;min-width:0;}
.cq-page-standard>main{max-width:980px;}
.cq-page-wide>main,.cq-page-wide main.comm-shell{max-width:1440px;}

/* Page header: title, description and optional action. */
.cq-page .cq-page-header,
.cq-page main>.dash-head,
.cq-page main>.admin-head,
.cq-page main>.participants-head,
.cq-page main>.directory-hero,
.cq-page main>.comm-hero{
 position:relative;margin:0 0 22px;padding:26px 30px;border:0;border-radius:20px;
 background:linear-gradient(115deg,var(--cq-blue),#147c79);color:#fff;
 box-shadow:0 12px 30px #124c681a;overflow:hidden;
}
.cq-page .cq-page-header h1,
.cq-page main>.dash-head h1,
.cq-page main>.admin-head h1,
.cq-page main>.participants-head h1,
.cq-page main>.directory-hero h1,
.cq-page main>.comm-hero h1{margin:7px 0 10px;color:#fff;font-size:clamp(1.9rem,3vw,2.7rem);line-height:1.15;}
.cq-page .cq-page-header p,
.cq-page main>.dash-head p,
.cq-page main>.admin-head p,
.cq-page main>.participants-head p,
.cq-page main>.directory-hero p,
.cq-page main>.comm-hero p{max-width:900px;margin:0;color:#e3f2f3;line-height:1.65;}
.cq-page .cq-page-header .eyebrow,.cq-page main>.dash-head .eyebrow{color:#ffe09b;}
.cq-page .cq-page-header-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:18px;}

/* Functional sections use one visual language without forcing identical content widths. */
.cq-page .cq-section,
.cq-page main>section.card,
.cq-page main>.card,
.cq-page main>.directory-grid>.directory-card,
.cq-page main>.comm-panel{
 min-width:0;border:1px solid var(--cq-border);border-radius:var(--cq-radius);
 background:var(--cq-panel);box-shadow:var(--cq-shadow);
}
.cq-page .cq-section{margin:0 0 22px;padding:24px;}
.cq-page main>section.card,.cq-page main>.card{width:100%;max-width:none;margin:0 0 22px;padding:24px;}
.cq-page .cq-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:12px;margin:0 0 22px;}
.cq-page .cq-summary>article{min-width:0;padding:18px;border:1px solid var(--cq-border);border-top:4px solid var(--cq-gold);border-radius:14px;background:#fff;}
.cq-page .cq-primary-action{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:10px;margin:22px 0;}
.cq-page img,.cq-page iframe,.cq-page video{max-width:100%;}
.cq-page table{max-width:100%;}
.cq-page input,.cq-page select,.cq-page textarea,.cq-page button{max-width:100%;}
.cq-page .cq-table,.cq-page .comm-table{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.page-package-rules table{width:100%;border-collapse:collapse;min-width:860px;}
.page-package-rules th,.page-package-rules td{padding:13px;text-align:left;vertical-align:top;border-bottom:1px solid #e3ebee;}
.page-package-rules td small{display:block;margin-top:4px;color:var(--cq-muted);}
.package-rule-form{display:flex;align-items:center;gap:8px;margin:0;}
.package-rule-form select{min-width:190px;margin:0;}
.package-rule-form button{margin:0;white-space:nowrap;}

.cq-page .front-footer{width:100%;display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px;padding:40px max(20px,calc((100vw - 1400px)/2));background:#103b35;color:#f6f9f5;text-align:left;}
.cq-page .front-footer>*{min-width:0;}.cq-page .front-footer h3{color:#fff}.cq-page .front-footer a{display:block;color:#f5dda0;margin:8px 0}.cq-page .front-footer>small{grid-column:1/-1;padding-top:14px;border-top:1px solid #ffffff35}

@media(max-width:700px){
 .cq-page>main,.cq-page main.comm-shell{padding:16px;}
 .cq-page .cq-page-header,.cq-page main>.dash-head,.cq-page main>.admin-head,
 .cq-page main>.participants-head,.cq-page main>.directory-hero,.cq-page main>.comm-hero{
  padding:22px 19px;border-radius:16px;margin-bottom:16px;
 }
 .cq-page .cq-section,.cq-page main>section.card,.cq-page main>.card{padding:18px;border-radius:15px;margin-bottom:16px;}
 .cq-page .cq-primary-action>*{width:100%;text-align:center;}
 .cq-page .front-footer{grid-template-columns:1fr;padding:32px 20px;}.cq-page .front-footer>small{grid-column:1;}
}
@media print{
 .cq-page{background:#fff;}
 .cq-page .cq-unified-header,.cq-page .front-footer,.cq-page .page-tools,.cq-page .admin-context{display:none!important;}
 .cq-page>main{max-width:none;padding:0;}
}
