.book-shell {
    max-width: 1000px; margin: 0 auto;
    padding: 3rem 1.5rem;
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 2rem;
    align-items: start;
}
@media(max-width:768px) { .book-shell { grid-template-columns: 1fr; } }

.book-back { font-size:.82rem;color:#888;text-decoration:none;display:inline-flex;align-items:center;gap:.35rem;margin-bottom:1.75rem;transition:color .15s;letter-spacing:.01em; }
.book-back:hover { color:#333; }

.book-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-size:1.9rem;font-weight:600;letter-spacing:-.01em;margin-bottom:.3rem;color:#121212;line-height:1.15;
}
.book-sub   { font-size:.87rem;color:#888;margin-bottom:2rem; }

.form-section-label {
    font-size:.65rem;font-weight:700;letter-spacing:.12em;
    text-transform:uppercase;color:#888888;
    margin-bottom:.9rem;padding-bottom:.5rem;
    border-bottom:1px solid #dddddd;
}

.field-group { margin-bottom:1.1rem; }
.field-group label {
    font-size:.72rem;font-weight:500;color:#aaaaaa;margin-bottom:.32rem;display:block;
    text-transform:uppercase;letter-spacing:1px;
}
.field-group input, .field-group select, .field-group textarea {
    width:100%;padding:.8rem 1rem;
    border:1px solid #dddddd;border-radius:10px;
    font-size:.87rem;color:#121212;
    background:#ffffff;font-family:inherit;
    transition:border-color 0.3s ease,box-shadow 0.3s ease;
    outline:none;
}
.field-group input:focus, .field-group select:focus, .field-group textarea:focus {
    border-color:#000000;
    box-shadow:0 0 0 3px rgba(0,0,0,.06);
}
.field-group input::placeholder, .field-group textarea::placeholder { color:#999999; }
.field-group input[readonly] { background:#f0f0f0;color:#888888;cursor:not-allowed;border-color:#dddddd; }
.field-group select option { background:#ffffff;color:#121212; }
.field-group .field-hint { font-size:.75rem;color:#888888;margin-top:.3rem; }
.field-row { display:grid;grid-template-columns:1fr 1fr;gap:1rem; }
@media(max-width:540px) { .field-row { grid-template-columns:1fr; } }

.submit-btn {
    width:100%;padding:.85rem;border-radius:12px;
    background:#000000;color:#fff;
    font-size:.93rem;font-weight:600;
    border:none;cursor:pointer;
    display:flex;align-items:center;justify-content:center;gap:.5rem;
    transition:all 0.3s ease;margin-top:1.5rem;letter-spacing:.02em;
    font-family:'Playfair Display', Georgia, serif;
}
.submit-btn:hover { background:#1e1e1e;color:#fff;transform:translateY(-2px); }

.addon-item {
    display:flex;align-items:center;gap:.75rem;
    padding:.8rem;border:1px solid #dddddd;border-radius:10px;
    cursor:pointer;transition:border-color 0.3s ease,background 0.3s ease;
    margin-bottom:.5rem;background:#ffffff;
}
.addon-item:hover { border-color:#000000;background:#f8f8f8; }
.addon-item.selected { border-color:#000000;background:#f0f0f0;box-shadow:0 0 0 1px #000000; }
.addon-item input[type=checkbox] { width:16px;height:16px;accent-color:#000;flex-shrink:0; }
.addon-name  { font-size:.87rem;font-weight:600;flex:1;color:#121212; }
.addon-price { font-size:.87rem;font-weight:700;color:#444;white-space:nowrap; }
.addon-item.selected .addon-name  { color:#000; }
.addon-item.selected .addon-price { color:#000; }

.summary-card {
    background:#ffffff;border:1px solid #dddddd;
    border-radius:18px;padding:1.5rem;
    position:sticky;top:84px;box-shadow:0 6px 30px rgba(0,0,0,.1);
}
.summary-card-header { font-size:.65rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#666;margin-bottom:1rem; }
.summary-pkg-name { font-family:'Playfair Display',Georgia,serif;font-size:1.1rem;font-weight:600;margin-bottom:.25rem;color:#121212;letter-spacing:-.01em; }
.summary-pkg-type {
    display:inline-block;font-size:.66rem;font-weight:600;
    padding:.22rem .65rem;border-radius:999px;
    background:#e8e8e8;color:#121212;
    margin-bottom:1rem;letter-spacing:.04em;text-transform:uppercase;
}
.summary-meta { display:flex;flex-direction:column;gap:.45rem;margin-bottom:1.25rem; }
.summary-meta-item { display:flex;align-items:center;gap:.5rem;font-size:.82rem;color:#666; }
.summary-meta-item i { color:#888;width:14px;text-align:center; }
.summary-divider { border:none;border-top:1px solid #dddddd;margin:1rem 0; }
.summary-price-row { display:flex;justify-content:space-between;align-items:center;font-size:.85rem;margin-bottom:.5rem;color:#121212; }
.summary-total { font-family:'Playfair Display',Georgia,serif;font-size:1.6rem;font-weight:700;letter-spacing:-.01em;color:#000000; }
.summary-note { font-size:.74rem;color:#888;margin-top:.75rem;line-height:1.55; }
.summary-addon-row { display:flex;justify-content:space-between;align-items:center;font-size:.82rem;color:#666;margin-bottom:.3rem; }

.validation-error { color:#cc3333;font-size:.76rem;margin-top:.25rem;display:block; }

.hour-stepper-btn {
    width:28px;height:28px;border-radius:6px;border:1px solid #cccccc;
    background:#f0f0f0;color:#121212;font-size:1rem;font-weight:700;
    cursor:pointer;display:flex;align-items:center;justify-content:center;
    line-height:1;transition:all 0.3s ease;flex-shrink:0;
}
.hour-stepper-btn:hover { background:#000000;border-color:#000000;color:#fff; }
.hour-stepper-btn:disabled { opacity:.35;cursor:not-allowed; }

.slot-availability { margin-top:.4rem; }

.cal-wrap {
    border:1px solid #dddddd;border-radius:10px;
    background:#ffffff;padding:.75rem;user-select:none;
}
.cal-header {
    display:flex;align-items:center;justify-content:space-between;
    margin-bottom:.65rem;
}
.cal-nav-btn {
    background:none;border:1px solid #dddddd;border-radius:7px;
    color:#666;width:28px;height:28px;cursor:pointer;
    display:flex;align-items:center;justify-content:center;font-size:.85rem;
    transition:all 0.3s ease;
}
.cal-nav-btn:hover { border-color:#000000;color:#000; }
.cal-month-label { font-size:.87rem;font-weight:600;color:#121212; }
.cal-grid {
    display:grid;grid-template-columns:repeat(7,1fr);gap:3px;
}
.cal-dow {
    text-align:center;font-size:.65rem;font-weight:700;
    letter-spacing:.06em;text-transform:uppercase;
    color:#888888;padding:.3rem 0;
}
.cal-day {
    text-align:center;padding:.42rem .2rem;border-radius:7px;
    font-size:.82rem;cursor:pointer;color:#121212;
    transition:background .12s,color .12s;border:1px solid transparent;
    line-height:1;
}
.cal-day:hover:not(.cal-day--disabled):not(.cal-day--past):not(.cal-day--selected) {
    background:#f0f0f0;border-color:#cccccc;
}
.cal-day--empty { cursor:default; }
.cal-day--past  { color:#bbbbbb;cursor:not-allowed; }
.cal-day--selected {
    background:#000000;color:#fff;font-weight:700;border-color:#000000;
}
.cal-day--full {
    color:#aaaaaa;cursor:pointer;
    position:relative;text-decoration:line-through;text-decoration-color:#cccccc;
}
.cal-day--full:hover { background:rgba(0,0,0,.04);border-color:#cccccc; }
.cal-day--today { border-color:#aaaaaa; }
.cal-selected-display {
    margin-top:.55rem;font-size:.78rem;color:#888888;text-align:center;min-height:1.2em;
}

#albumSlidePrev:hover, #albumSlideNext:hover, #btnCloseAlbumSample:hover {
    background: #333333 !important;
}
#albumSlideArea {
    padding: 3.5rem 4.5rem 3rem;
}
.album-info-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-left: 4px;
    cursor: pointer;
}
.album-info-icon {
    font-size: .75rem;
    color: #888;
    transition: color .15s;
}
.album-info-wrap:hover .album-info-icon,
.album-info-wrap.active .album-info-icon {
    color: #000;
}
.album-info-popover {
    display: none;
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: .55rem .95rem;
    box-shadow: 0 4px 16px rgba(0,0,0,.1);
    z-index: 100;
    white-space: nowrap;
}
.album-info-popover ul {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: .78rem;
    color: #444;
    line-height: 1.75;
}
.album-info-popover ul li::before {
    content: "•";
    margin-right: .45rem;
    color: #888;
}
.album-info-wrap:hover .album-info-popover,
.album-info-wrap.active .album-info-popover {
    display: block;
}

@media(max-width:600px) {
    #albumSlideArea { padding: 3.5rem 1rem 3rem; }
    #albumSlidePrev { left:.4rem !important; }
    #albumSlideNext { right:.4rem !important; }
}
