:root {
    --ink: #09181e;
    --ink2: #10252c;
    --ink3: #163039;
    --gold: #c9a36a;
    --light-gold: #e9d0a0;
    --dark-gold: #8b6a3c;
    --cream: #f6f1e7;
    --cream2: #e9e0d1;
    --text: #263137;
    --muted: #697074;
    --serif: 'Cormorant Garamond',Georgia,serif;
    --sans: 'Plus Jakarta Sans',Arial,sans-serif;
    --shadow: 0 22px 70px rgba(8,24,31,.13);
}

* {
    box-sizing:border-box
}

html {
    scroll-behavior:smooth;
    scroll-padding-top:85px
}

body {
    margin:0;
    font-family:var(--sans);
    font-size:14px;
    color:var(--text);
    background:var(--cream);
    -webkit-font-smoothing: antialiased;
}

button,input,textarea,select {
    font:inherit
}

button {
    cursor:pointer
}

a {
    color:inherit;
    text-decoration:none
}

button:disabled {
    opacity:.6;
    cursor:wait
}

input,textarea,select {
    width:100%;
    border:1px solid #d7d1c6;
    background:#fffdf8;
    color:#1c282c;
    border-radius:4px;
    padding:13px 15px;
    outline:0;
    transition:border .2s,box-shadow .2s
}

input:focus,textarea:focus,select:focus {
    border-color:#b99a6b;
    box-shadow:0 0 0 3px rgba(201,163,106,.15)
}

textarea {
    resize:vertical
}

::selection {
    background:var(--gold);
    color:var(--ink)
}

.hidden,[hidden] {
    display:none!important
}

.visually-hidden {
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap
}

.top-progress {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:3px;
    background:linear-gradient(90deg,var(--dark-gold),#f2d9a4,var(--gold));
    z-index:30
}

.site-header {
    position:absolute;
    inset:3px 0 auto;
    z-index:5;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:28px max(5vw,24px);
    color:#f2ede4
}

.brand {
    display:flex;
    align-items:center;
    gap:13px
}

.brand-symbol {
    font-family:var(--serif);
    font-size:34px;
    font-weight:700;
    
    height:57px;
    width:65px;
    display:grid;
    place-items:center;
    letter-spacing:-3px;
    color:var(--light-gold);
    position:relative
}

.brand-star {
    font:10px var(--sans);
    position:relative;
    top:-9px;
    letter-spacing:0;
    margin:0 1px
}

.brand-copy {
    display:grid;
    gap:4px
}

.brand-copy strong {
    font-size:12px;
    letter-spacing:2.1px;
    font-weight:800
}

.brand-copy small {
    font-size:9px;
    letter-spacing:2.4px;
    color:var(--gold)
}

.header-cta {
    font-size:11px;
    letter-spacing:.6px;
    border:1px solid rgba(233,208,160,.6);
    padding:13px 18px;
    transition:.2s
}

.header-cta:hover {
    background:var(--gold);
    color:var(--ink)
}

.header-cta span {
    margin-left:10px
}

.hero {
    position:relative;
    min-height:840px;
    min-height:100svh;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:var(--cream);
    overflow:hidden;
    background:radial-gradient(ellipse at 50% 45%,rgba(40,63,62,.65) 0%,rgba(12,29,35,.65) 40%,transparent 71%),linear-gradient(155deg,#071319,#102930 53%,#0b1a20);
    isolation:isolate
}

.hero:before {
    content:'';
    position:absolute;
    inset:0;
    background-image:radial-gradient(circle,rgba(239,210,157,.65) 1px,transparent 1.6px);
    background-size:81px 97px;
    mask-image:radial-gradient(circle at center,#000,transparent 75%);
    opacity:.25;
    z-index:-1
}

.hero:after {
    content:'';
    position:absolute;
    inset:12px;
    border:1px solid rgba(201,163,106,.21);
    pointer-events:none;
    z-index:3
}

.hero-ornament {
    position:absolute;
    width:34vw;
    height:1px;
    background:linear-gradient(90deg,transparent,rgba(201,163,106,.33),transparent);
    top:39%
}

.hero-ornament-left {
    left:-12vw;
    transform:rotate(57deg)
}

.hero-ornament-right {
    right:-12vw;
    transform:rotate(-57deg)
}

.gold-halo {
    position:absolute;
    border:1px solid rgba(221,185,118,.12);
    border-radius:50%;
    width:min(82vw,690px);
    aspect-ratio:1;
    left:50%;
    top:48%;
    transform:translate(-50%,-50%);
    box-shadow:0 0 0 55px rgba(201,163,106,.018),0 0 0 115px rgba(201,163,106,.018);
    pointer-events:none
}

.halo-two {
    width:min(66vw,550px);
    border-style:dashed;
    opacity:.6;
    animation:slowspin 70s linear infinite
}

.hero-content {
    position:relative;
    z-index:2;
    padding:120px 16px 135px;
    max-width:980px
}

.hero-eyebrow {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:17px;
    font-size:10px;
    letter-spacing:4px;
    color:var(--light-gold);
    font-weight:700
}

.eyebrow-rule {
    width:43px;
    height:1px;
    background:linear-gradient(90deg,transparent,var(--gold))
}

.eyebrow-rule:last-child {
    transform:rotate(180deg)
}

.emblem {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:18px;
    height:205px;
    margin-top:6px
}

.emblem-number {
    font:500 clamp(150px,17vw,223px)/1 var(--serif);
    letter-spacing:-13px;
    background:linear-gradient(130deg,#947246 8%,#fbebc6 35%,#c69b5e 58%,#fae4ae 80%,#917044);
    -webkit-background-clip: text;
    background-clip:text;
    color:transparent;
    filter:drop-shadow(0 15px 14px rgba(0,0,0,.12))
}

.emblem-branch {
    font:65px var(--serif);
    color:var(--gold);
    opacity:.66
}

.branch-left {
    transform:rotate(-40deg)
}

.branch-right {
    transform:scaleX(-1) rotate(-40deg)
}

.hero-mini {
    font-size:10px;
    letter-spacing:7px;
    color:#e9c990;
    font-weight:700;
    margin:-7px 0 29px
}

.hero h1 {
    font:500 clamp(53px,6.7vw,99px)/.91 var(--serif);
    letter-spacing:-1.8px;
    margin:0
}

.hero h1 em {
    color:var(--light-gold);
    font-weight:400
}

.hero-divider {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:13px;
    color:var(--gold);
    margin:30px auto 22px
}

.hero-divider i {
    height:1px;
    width:92px;
    background:linear-gradient(90deg,transparent,rgba(201,163,106,.76))
}

.hero-divider i:last-child {
    transform:rotate(180deg)
}

.hero-company {
    font-size:15px;
    font-weight:800;
    letter-spacing:6px;
    margin:0
}

.hero-description {
    font:400 19px/1.7 var(--serif);
    color:#c8d0cf;
    margin:19px 0 30px
}

.gold-button {
    display:inline-flex;
    justify-content:center;
    align-items:center;
    gap:24px;
    background:linear-gradient(115deg,#b99257,#f0d6a6 52%,#c19b62);
    color:#132127;
    border:0;
    border-radius:2px;
    min-height:52px;
    padding:15px 25px;
    font-size:12px;
    font-weight:800;
    letter-spacing:.5px;
    box-shadow:0 13px 31px rgba(9,19,25,.17);
    transition:transform .2s,box-shadow .2s
}

.gold-button:hover {
    transform:translateY(-2px);
    box-shadow:0 18px 35px rgba(9,19,25,.28)
}

.hero-button {
    min-width:204px
}

.hero-landscape {
    position:absolute;
    bottom:-1px;
    left:0;
    width:100%;
    height:min(25vw,215px);
    pointer-events:none
}

.hero-landscape svg {
    height:100%;
    width:100%
}

.scroll-indicator {
    position:absolute;
    bottom:24px;
    z-index:2;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:8px;
    color:var(--light-gold);
    font-size:9px;
    font-weight:700;
    letter-spacing:3px
}

.scroll-indicator b {
    font-weight:300;
    font-size:19px;
    animation:bounce 2s infinite
}

.section-wrap {
    max-width:1210px;
    margin:auto;
    padding:116px 30px;
    scroll-margin-top:70px
}

.section-overline {
    text-align:center;
    color:var(--dark-gold);
    letter-spacing:4px;
    font-weight:800;
    font-size:10px;
    margin:0 0 17px
}

.section-title {
    text-align:center;
    font:500 clamp(48px,5vw,72px)/1 var(--serif);
    margin:0;
    letter-spacing:-1px
}

.section-title em {
    color:var(--dark-gold);
    font-weight:400
}

.section-star {
    text-align:center;
    font-size:24px;
    color:var(--gold);
    margin:-8px 0 12px
}

.section-intro {
    text-align:center;
    max-width:610px;
    color:#697074;
    line-height:1.95;
    margin:20px auto 50px;
    font-size:13px
}

.invitation-section {
    padding-bottom:95px
}

.invitation-paper {
    max-width:710px;
    position:relative;
    margin:50px auto 0;
    text-align:center;
    padding:64px 72px 60px;
    background:linear-gradient(140deg,#fffdfa 0%,#f7f0e3 100%);
    box-shadow:var(--shadow);
    border:1px solid #e0d1b9
}

.invitation-paper:after {
    content:'';
    position:absolute;
    inset:11px;
    border:1px solid rgba(172,135,76,.4);
    pointer-events:none
}

.paper-corner {
    position:absolute;
    width:42px;
    height:42px;
    z-index:1;
    pointer-events:none;
    border-color:var(--gold)
}

.c1 {
    top:17px;
    left:17px;
    border-top:2px solid;
    border-left:2px solid
}

.c2 {
    top:17px;
    right:17px;
    border-top:2px solid;
    border-right:2px solid
}

.c3 {
    bottom:17px;
    left:17px;
    border-bottom:2px solid;
    border-left:2px solid
}

.c4 {
    bottom:17px;
    right:17px;
    border-bottom:2px solid;
    border-right:2px solid
}

.paper-flourish {
    color:var(--gold);
    font:23px var(--serif);
    letter-spacing:6px
}

.paper-intro {
    font:400 23px var(--serif);
    color:#576065;
    margin:28px 0 6px
}

.invitee-name {
    font:600 clamp(39px,5vw,55px)/1.05 var(--serif);
    color:#243135;
    margin:0 0 25px;
    word-break:break-word
}

.short-gold-line {
    width:54px;
    height:1px;
    background:var(--gold);
    margin:0 auto 27px
}

.paper-message {
    font:400 20px/1.65 var(--serif);
    max-width:480px;
    margin:0 auto;
    color:#525a5b
}

.paper-closing {
    font:400 18px/1.6 var(--serif);
    margin:30px 0 27px;
    color:#6e716c
}

.paper-signature {
    font:400 18px/1.4 var(--serif);
    margin:0
}

.paper-signature strong {
    font:700 12px var(--sans);
    letter-spacing:2px;
    color:#8d6e42
}

.event-section {
    padding-top:75px
}

.event-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:15px;
    margin:46px 0 30px
}

.detail-card {
    text-align:center;
    padding:38px 22px;
    background:#fffcf7;
    border:1px solid #e6dccd;
    min-height:234px;
    transition:transform .2s,border .2s
}

.detail-card:hover {
    transform:translateY(-4px);
    border-color:var(--gold)
}

.detail-icon {
    color:var(--dark-gold);
    font:37px var(--serif);
    margin:0 0 18px
}

.detail-label {
    color:#a18153;
    letter-spacing:2.8px;
    font-size:9px;
    font-weight:800;
    margin:0 0 14px
}

.detail-card h3 {
    font:600 29px/1.08 var(--serif);
    margin:0 0 12px;
    color:#253339
}

.detail-card>p:last-child {
    font-size:11px;
    color:#7b807e;
    line-height:1.75;
    margin:0
}

.outline-button {
    display:table;
    margin:20px auto 0;
    padding:15px 25px;
    border:1px solid var(--dark-gold);
    color:#80643d;
    font-size:11px;
    letter-spacing:1px;
    font-weight:800;
    background:transparent;
    transition:.2s
}

.outline-button:hover {
    background:var(--gold);
    color:#12242a
}

.outline-button span {
    margin-left:15px
}

.countdown {
    max-width:600px;
    margin:60px auto 0;
    text-align:center;
    border-top:1px solid #d5c5af;
    padding-top:25px
}

.countdown-eyebrow {
    font-size:10px;
    letter-spacing:3px;
    color:var(--dark-gold);
    font-weight:800
}

.countdown-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:10px;
    margin-top:25px
}

.countdown-grid div {
    display:grid;
    gap:8px
}

.countdown-grid strong {
    font:600 52px/1 var(--serif);
    color:#26383b
}

.countdown-grid span {
    font-size:9px;
    font-weight:800;
    letter-spacing:2px;
    color:#9d815c
}

.quote-section {
    background:linear-gradient(155deg,#0d252c,#06151a);
    padding:100px 30px;
    color:var(--cream);
    position:relative;
    overflow:hidden
}

.quote-section:before {
    content:'';
    position:absolute;
    inset:-20%;
    background:repeating-radial-gradient(circle at 50% 50%,transparent 0,transparent 60px,rgba(209,173,108,.055) 61px,transparent 62px)
}

.quote-frame {
    max-width:850px;
    margin:auto;
    border:1px solid rgba(201,163,106,.44);
    padding:42px 60px 50px;
    text-align:center;
    position:relative
}

.quote-mark {
    font:110px/.8 var(--serif);
    color:var(--gold)
}

.quote-frame blockquote {
    font:400 clamp(30px,4.1vw,48px)/1.18 var(--serif);
    margin:12px 0 35px
}

.quote-frame blockquote em {
    color:var(--light-gold)
}

.quote-frame p {
    font-size:9px;
    letter-spacing:3px;
    color:#c4a679;
    font-weight:800
}

.rsvp-section {
    padding-bottom:105px
}

.rsvp-layout {
    display:grid;
    grid-template-columns:1.07fr .93fr;
    box-shadow:var(--shadow);
    background:#fffdf9;
    max-width:1010px;
    margin:auto
}

.rsvp-form {
    padding:45px 48px 37px
}

.form-topline {
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#8e7048;
    font-size:10px;
    letter-spacing:2.5px;
    border-bottom:1px solid #e6dbca;
    padding-bottom:24px;
    margin-bottom:28px;
    font-weight:800
}

.form-topline span {
    color:var(--gold)
}

.form-field {
    margin-bottom:24px
}

.form-field label {
    display:block;
    font-weight:800;
    font-size:11px;
    color:#354145;
    margin-bottom:11px
}

.form-field label small {
    font-weight:500;
    color:#9b9b98
}

.required {
    color:#ac7547
}

.attendance-options {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:11px
}

.attendance-option {
    display:flex!important;
    align-items:center;
    gap:12px;
    cursor:pointer;
    border:1px solid #ded7cc;
    background:#fffefa;
    border-radius:4px;
    padding:15px 13px;
    margin:0!important;
    transition:.2s
}

.attendance-option:has(input:checked) {
    border-color:#b68d51;
    background:#f8f1e3;
    box-shadow:inset 0 0 0 1px rgba(201,163,106,.5)
}

.attendance-option input {
    position:absolute;
    opacity:0;
    width:1px;
    height:1px
}

.attendance-option:focus-within {
    outline:2px solid var(--gold);
    outline-offset:2px
}

.radio-badge {
    display:grid;
    place-items:center;
    flex:0 0 26px;
    width:26px;
    height:26px;
    border:1px solid #c5ad8a;
    border-radius:50%;
    font-size:14px;
    color:#8d744e
}

.attendance-option:has(input:checked) .radio-badge {
    background:var(--dark-gold);
    color:#fff
}

.attendance-option strong {
    display:block;
    font-size:11px;
    color:#243238;
    white-space:nowrap
}

.attendance-option small {
    font-size:9px;
    color:#8c908e;
    display:block;
    margin-top:4px
}

.char-count {
    margin:6px 0 0;
    text-align:right;
    color:#999;
    font-size:10px
}

.submit-button {
    width:100%
}

.form-hint {
    font-size:10px;
    color:#a5a19a;
    text-align:center;
    line-height:1.7
}

.notice {
    margin-top:14px;
    padding:15px;
    line-height:1.7;
    border:1px solid #e4d2b6;
    background:#fcf3e3;
    font-size:12px;
    border-radius:3px
}

.notice.success {
    border-color:#b7d3bc;
    background:#ecf8ef;
    color:#31633c
}

.notice.error {
    border-color:#ddadad;
    background:#fff0ef;
    color:#973f3c
}

.rsvp-aside {
    background:radial-gradient(ellipse at 50% 0%,#28454a 0%,#10262d 42%,#081920 100%);
    color:var(--cream);
    padding:55px 45px 30px;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    position:relative;
    overflow:hidden
}

.rsvp-aside:after {
    content:'';
    border:1px solid rgba(201,163,106,.4);
    position:absolute;
    inset:14px;
    pointer-events:none
}

.aside-circle {
    width:108px;
    height:108px;
    border:1px solid rgba(228,200,145,.7);
    border-radius:50%;
    display:grid;
    place-items:center;
    color:var(--light-gold);
    font-size:41px;
    box-shadow:0 0 0 11px rgba(211,184,136,.05);
    margin:8px auto 55px
}

.aside-overline {
    font-size:10px;
    letter-spacing:3px;
    color:#ddbd8b;
    font-weight:800
}

.rsvp-aside h3 {
    font:500 56px/.95 var(--serif);
    margin:9px 0 28px
}

.rsvp-aside h3 em {
    color:var(--light-gold)
}

.rsvp-aside>p:not(.aside-overline) {
    font:17px/1.7 var(--serif);
    color:#c8d0cc;
    max-width:290px
}

.aside-rule {
    width:90px;
    height:1px;
    background:#aa895b;
    margin:25px auto 12px
}

.rsvp-aside .aside-sign {
    color:#e5ceaa!important;
    font-style:italic!important
}

.aside-bottom {
    margin-top:auto;
    padding-top:40px;
    color:#b5966b;
    letter-spacing:2px;
    font-size:9px;
    font-weight:800
}

.wishes-section {
    padding-top:24px
}

.wishes-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:17px;
    margin-top:45px
}

.wish-card {
    border:1px solid #e2d7c5;
    background:#fffdf8;
    padding:27px;
    min-height:175px
}

.wish-icon {
    font:40px/.8 var(--serif);
    color:var(--gold)
}

.wish-card p {
    font:18px/1.45 var(--serif);
    margin:9px 0 27px;
    overflow-wrap:anywhere
}

.wish-meta {
    border-top:1px solid #ece5da;
    padding-top:16px;
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:center
}

.wish-meta strong {
    font-size:11px;
    color:#2a383b
}

.wish-meta span {
    font-size:10px;
    color:#9e9584
}

.wishes-empty {
    grid-column:1/-1;
    text-align:center;
    padding:40px 10px;
    color:#8a8985;
    border:1px dashed #d9c7ac
}

.closing-section {
    background:linear-gradient(180deg,#10272e,#08181f);
    color:var(--cream);
    text-align:center;
    overflow:hidden
}

.closing-inner {
    max-width:910px;
    margin:auto;
    padding:97px 25px 94px;
    position:relative
}

.closing-inner:before {
    content:'';
    position:absolute;
    width:800px;
    height:800px;
    border:1px solid rgba(201,163,106,.12);
    border-radius:50%;
    top:-310px;
    left:50%;
    transform:translateX(-50%);
    pointer-events:none
}

.closing-inner .section-overline {
    color:var(--gold)
}

.closing-inner h2 {
    font:500 clamp(48px,5.5vw,75px)/1 var(--serif);
    margin:20px 0 27px
}

.closing-inner h2 em {
    color:var(--light-gold)
}

.closing-inner>p:not(.section-overline) {
    color:#bdc9c6;
    line-height:1.9;
    max-width:550px;
    margin:0 auto 37px
}

.closing-mark {
    font:600 41px var(--serif);
    letter-spacing:6px;
    color:var(--gold);
    margin-bottom:20px
}

.closing-mark span {
    font:15px var(--sans);
    vertical-align:middle
}

.closing-share {
    border-color:#a88452;
    color:#e6c994;
    position:relative
}

.closing-share:hover {
    color:#0c1b21
}

.site-footer {
    display:flex;
    justify-content:space-between;
    gap:18px;
    flex-wrap:wrap;
    padding:21px max(5vw,25px);
    background:#07151b;
    color:#a6a89e;
    font-size:9px;
    letter-spacing:2px
}

.floating-rsvp {
    display:none
}

@keyframes slowspin {
    from {
        transform:translate(-50%,-50%) rotate(0)
    }
    to {
        transform:translate(-50%,-50%) rotate(360deg)
    }
}

@keyframes bounce {
    0%,100% {
        transform:translateY(0)
    }
    50% {
        transform:translateY(6px)
    }
}

/* Dashboard panitia */

.admin-body {
    background:#f4f2ed;
    min-height:100vh
}

.login-shell {
    min-height:100vh;
    display:grid;
    place-items:center;
    padding:25px;
    background:radial-gradient(circle at 50% 5%,#234149,#0a1820 65%);
    color:var(--cream)
}

.login-panel {
    width:min(100%,475px);
    padding:52px 48px;
    border:1px solid rgba(201,163,106,.5);
    background:rgba(7,22,29,.73);
    text-align:center;
    box-shadow:0 25px 80px rgba(0,0,0,.27)
}

.login-emblem {
    font:600 44px var(--serif);
    color:#e9ca94;
    letter-spacing:4px;
    margin:0 0 26px
}

.login-emblem span {
    font:14px var(--sans);
    vertical-align:middle
}

.login-panel .section-overline {
    color:#cfae78
}

.login-panel h1 {
    font:500 55px/1 var(--serif);
    margin:0 0 17px
}

.login-panel h1 em {
    color:#e9ca94
}

.login-panel>p:not(.section-overline) {
    color:#b1c0bf;
    line-height:1.85;
    font-size:12px
}

.login-form {
    margin:35px 0 24px;
    text-align:left;
    display:grid;
    gap:12px
}

.login-form label {
    font-size:11px;
    font-weight:700
}

.login-form input {
    background:#fdfbf7
}

.login-return {
    font-size:11px;
    color:#d0b98b
}

.dashboard {
    min-height:100vh
}

.dashboard-sidebar {
    position:fixed;
    inset:0 auto 0 0;
    width:250px;
    background:#0c2028;
    color:#eee8dd;
    padding:28px 22px;
    display:flex;
    flex-direction:column;
    z-index:10
}

.dashboard-logo {
    display:flex;
    align-items:center;
    gap:11px
}

.dashboard-logo .brand-symbol {
    width:48px;
    height:48px;
    font-size:24px;
    flex-shrink:0
}

.dashboard-logo strong {
    display:block;
    font-size:9px;
    letter-spacing:1.7px
}

.dashboard-logo small {
    display:block;
    font-size:8px;
    color:var(--gold);
    letter-spacing:1.6px;
    margin-top:6px
}

.sidebar-eyebrow {
    color:#859ba0;
    font-size:10px;
    letter-spacing:2px;
    font-weight:800;
    margin:62px 10px 15px
}

.sidebar-nav {
    display:grid;
    gap:5px
}

.sidebar-nav a {
    padding:14px 12px;
    border-radius:4px;
    font-size:12px;
    color:#b0c2c2;
    transition:.2s
}

.sidebar-nav a:hover,.sidebar-nav a.active {
    background:#1e3942;
    color:#f1d49c
}

.sidebar-foot {
    margin-top:auto;
    display:grid;
    gap:20px;
    padding:20px 10px 0;
    border-top:1px solid #27434b
}

.sidebar-foot a,.sidebar-foot button {
    font-size:11px;
    color:#c9d4d0;
    background:none;
    border:0;
    padding:0;
    text-align:left;
    font-weight:600
}

.dashboard-main {
    margin-left:250px;
    max-width:calc(100% - 250px);
    padding:43px max(3.5vw,32px) 30px
}

.dash-topbar {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    margin-bottom:39px
}

.dash-kicker {
    font-size:9px;
    color:#a08150;
    font-weight:800;
    letter-spacing:2.7px;
    margin:0 0 9px
}

.dash-topbar h1,.dash-section h2 {
    font:500 44px/1 var(--serif);
    margin:0
}

.dash-topbar em,.dash-section h2 em {
    color:#a08050
}

.admin-pill {
    font-size:9px;
    letter-spacing:2px;
    border:1px solid #d9c8ad;
    padding:12px 14px;
    color:#8c734e;
    white-space:nowrap
}

.stats-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:15px
}

.stats-grid article {
    background:#fff;
    border:1px solid #e6e2d9;
    padding:22px;
    display:grid;
    gap:12px
}

.stats-grid span {
    font-size:9px;
    letter-spacing:1.5px;
    color:#8f8a80;
    font-weight:800
}

.stats-grid strong {
    font:600 55px/1 var(--serif);
    color:#22363c
}

.stats-grid small {
    font-size:10px;
    color:#8a938f
}

.dash-section {
    margin-top:60px
}

.dash-section-head {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
    margin-bottom:22px
}

.dash-section h2 {
    font-size:37px
}

.admin-outline {
    border:1px solid #cdbda6;
    padding:11px 14px;
    background:transparent;
    color:#826942;
    font-weight:800;
    font-size:10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    white-space:nowrap;
    transition:.2s
}

.admin-outline:hover {
    background:#ede1d0
}

.admin-cards {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px
}

.dash-card {
    background:#fff;
    border:1px solid #e5e0d7;
    padding:28px
}

.dash-card h3 {
    font:600 26px var(--serif);
    margin:0 0 7px;
    color:#22343b
}

.dash-card>p {
    font-size:11px;
    color:#868b89;
    line-height:1.75;
    margin:0 0 24px
}

.dash-card .form-field {
    margin-bottom:15px
}

.dash-card label {
    font-size:11px
}

.dash-card .gold-button {
    width:100%;
    min-height:45px;
    margin-top:7px
}

.link-result {
    margin-top:18px;
    background:#f7f3eb;
    padding:14px;
    border:1px solid #ded1bc;
    overflow:hidden
}

.link-result label {
    display:block;
    font-size:10px;
    font-weight:700;
    margin-bottom:8px
}

.link-result input {
    font-size:10px
}

.link-actions {
    display:flex;
    gap:10px;
    margin-top:10px
}

.link-actions>* {
    flex:1
}

.step-row {
    display:flex;
    align-items:flex-start;
    gap:15px;
    border-bottom:1px solid #eee8df;
    padding:13px 0
}

.step-row b {
    font:600 24px var(--serif);
    color:#c29c65;
    min-width:25px
}

.step-row span {
    font-size:11px;
    color:#656e6f;
    line-height:1.6
}

.privacy-note {
    margin-top:16px!important;
    font-style:italic
}

.table-panel {
    background:white;
    border:1px solid #e5e0d7;
    margin-top:22px
}

.table-toolbar {
    padding:23px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px
}

.table-toolbar h3 {
    font:600 26px var(--serif);
    margin:0
}

.table-controls {
    display:flex;
    gap:10px
}

.table-controls input {
    width:235px
}

.table-controls select {
    width:165px
}

.table-controls input,.table-controls select {
    font-size:11px;
    padding:10px
}

.table-scroll {
    overflow-x:auto
}

table {
    width:100%;
    border-collapse:collapse;
    text-align:left
}

th {
    background:#f6f2eb;
    font-size:9px;
    letter-spacing:1.4px;
    color:#8b7f6c;
    padding:16px 18px;
    white-space:nowrap
}

td {
    padding:16px 18px;
    border-bottom:1px solid #eeeae3;
    font-size:11px;
    color:#4c5a5d;
    vertical-align:middle
}

td:first-child {
    font-weight:800;
    color:#273b3f;
    max-width:180px
}

td:nth-child(4) {
    min-width:200px;
    max-width:300px;
    white-space:normal;
    overflow-wrap:anywhere
}

td:last-child {
    min-width:230px
}

.status-badge {
    display:inline-block;
    padding:7px 9px;
    font-size:9px;
    font-weight:800;
    border-radius:2px;
    white-space:nowrap
}

.status-yes {
    background:#e9f6ec;
    color:#347447
}

.status-no {
    background:#fff0ee;
    color:#a4584d
}

.status-wait {
    background:#f1eee8;
    color:#8a8378
}

.row-actions {
    display:flex;
    flex-wrap:wrap;
    gap:6px
}

.row-actions button,.row-actions a {
    border:1px solid #dcd4c8;
    border-radius:3px;
    font-size:10px;
    padding:7px 9px;
    background:#fff;
    color:#775d38;
    font-weight:700;
    white-space:nowrap
}

.row-actions .danger {
    color:#ac564c;
    border-color:#f0cdca
}

.row-actions .approved {
    background:#edf7ed;
    color:#2b6840
}

.table-foot {
    padding:15px 22px;
    font-size:10px;
    color:#8b8d86
}

.settings-card {
    padding:31px
}

.settings-grid {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:5px 22px
}

.settings-grid .form-field small {
    font-size:10px;
    color:#9b9387;
    display:block;
    margin-top:5px
}

.full-span {
    grid-column:1/-1
}

.settings-actions {
    display:flex;
    align-items:center;
    gap:16px
}

.settings-actions .gold-button {
    width:auto;
    min-width:200px
}

.small-note {
    font-size:11px;
    color:#99948b
}

.admin-footer {
    margin-top:60px;
    border-top:1px solid #ddd7cc;
    padding-top:23px;
    color:#999187;
    letter-spacing:1.5px;
    font-size:9px
}

.toast {
    position:fixed;
    bottom:27px;
    right:27px;
    z-index:25;
    max-width:360px;
    background:#15352c;
    color:#fff;
    padding:16px 20px;
    box-shadow:0 12px 40px #1114;
    font-size:12px;
    line-height:1.6
}

.toast.error {
    background:#9d453f
}

@media(max-width:1050px) {
    .event-grid {
        grid-template-columns:repeat(2,1fr)
    }
    .dashboard-sidebar {
        width:205px
    }
    .dashboard-main {
        margin-left:205px;
        max-width:calc(100% - 205px);
        padding:35px 24px
    }
    .stats-grid {
        grid-template-columns:repeat(2,1fr)
    }
    .admin-cards {
        grid-template-columns:1fr
    }
}

@media(max-width:700px) {
    .site-header {
        padding:18px 22px
    }
    .site-header .brand-copy {
        display:none
    }
    .header-cta {
        font-size:10px;
        padding:12px
    }
    .hero {
        min-height:760px
    }
    .hero-content {
        padding:125px 18px
    }
    .hero-eyebrow {
        font-size:8px;
        letter-spacing:2.4px;
        gap:9px
    }
    .eyebrow-rule {
        width:21px
    }
    .emblem {
        height:156px
    }
    .emblem-number {
        font-size:160px
    }
    .emblem-branch {
        font-size:37px
    }
    .hero-mini {
        letter-spacing:4px;
        font-size:9px;
        margin-top:0
    }
    .hero h1 {
        font-size:58px
    }
    .hero-description {
        font-size:17px
    }
    .hero-company {
        font-size:11px;
        letter-spacing:4px
    }
    .hero-landscape {
        height:125px
    }
    .scroll-indicator {
        bottom:14px
    }
    .section-wrap {
        padding:77px 20px
    }
    .section-title {
        font-size:51px
    }
    .invitation-paper {
        margin-top:38px;
        padding:54px 32px 50px
    }
    .paper-intro {
        font-size:20px
    }
    .paper-message {
        font-size:19px
    }
    .detail-card {
        min-height:200px;
        padding:27px 15px
    }
    .detail-card h3 {
        font-size:26px
    }
    .event-grid {
        gap:10px;
        margin-top:35px
    }
    .quote-section {
        padding:65px 18px
    }
    .quote-frame {
        padding:40px 22px
    }
    .rsvp-layout {
        grid-template-columns:1fr
    }
    .rsvp-form {
        padding:30px 23px
    }
    .rsvp-aside {
        min-height:440px;
        padding:35px 25px
    }
    .aside-circle {
        margin-bottom:25px
    }
    .rsvp-aside h3 {
        font-size:49px
    }
    .wishes-grid {
        grid-template-columns:1fr
    }
    .wishes-section {
        padding-top:10px
    }
    .closing-inner {
        padding:77px 22px
    }
    .closing-inner h2 {
        font-size:51px
    }
    .site-footer {
        justify-content:center;
        text-align:center;
        padding:22px 15px;
        line-height:1.7
    }
    .floating-rsvp {
        display:flex;
        align-items:center;
        gap:7px;
        position:fixed;
        bottom:18px;
        right:18px;
        z-index:11;
        background:linear-gradient(130deg,#c79b58,#efd3a4);
        box-shadow:0 8px 30px #0003;
        color:#172429;
        font-size:11px;
        font-weight:800;
        letter-spacing:1px;
        padding:14px 17px;
        border-radius:40px
    }
    .dashboard-sidebar {
        position:static;
        width:100%;
        height:auto;
        padding:16px
    }
    .dashboard-logo .brand-symbol {
        width:40px;
        height:40px
    }
    .sidebar-eyebrow,.sidebar-nav,.sidebar-foot {
        display:none
    }
    .dashboard-main {
        max-width:100%;
        margin-left:0;
        padding:25px 16px
    }
    .dash-topbar {
        margin-bottom:22px
    }
    .dash-topbar h1 {
        font-size:39px
    }
    .admin-pill {
        display:none
    }
    .stats-grid {
        gap:10px
    }
    .stats-grid article {
        padding:16px
    }
    .stats-grid strong {
        font-size:43px
    }
    .stats-grid span {
        font-size:8px
    }
    .dash-section {
        margin-top:42px
    }
    .dash-section h2 {
        font-size:35px
    }
    .dash-section-head {
        align-items:flex-start
    }
    .admin-outline {
        font-size:9px;
        padding:9px
    }
    .dash-card {
        padding:23px
    }
    .table-toolbar {
        display:grid;
        gap:13px;
        padding:16px
    }
    .table-controls {
        width:100%
    }
    .table-controls input {
        width:60%
    }
    .table-controls select {
        width:40%
    }
    .table-scroll {
        overflow-x:auto
    }
    .settings-grid {
        grid-template-columns:1fr
    }
    .full-span {
        grid-column:auto
    }
    .settings-actions {
        flex-direction:column;
        align-items:stretch
    }
    .settings-actions .gold-button {
        width:100%
    }
    .login-panel {
        padding:40px 26px
    }
    .login-panel h1 {
        font-size:47px
    }
}

@media(max-width:370px) {
    .attendance-options {
        grid-template-columns:1fr
    }
    .hero h1 {
        font-size:49px
    }
    .section-title {
        font-size:43px
    }
    .detail-card h3 {
        font-size:23px
    }
}

@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior:auto
    }
    *,*:before,*:after {
        animation:none!important;
        transition:none!important
    }
}
