/*
Theme Name: skript coffee
Theme URI: https://skriptcoffee.com
Author: Blankskript Digital Solutions
Description: The skript. coffee brand theme. coffee for all your vibes
Version: 0.6.3
Requires at least: 6.6
Requires PHP: 8.1
License: Proprietary
Text Domain: blankskript-coffee
*/

/*
 * Look (Feroz, 1 November 2026): classy, old-money, Caffe Nero feel. Dark browns, brick, deep green and wine.
 * The red #C90000 is only for the logo tab and the iconic cup. Nothing here capitalises text by styling.
 */

:root { --sc-on-dark: rgba(247, 242, 234, .78); --sc-section: clamp(4rem, 11vw, 8.5rem); }

/* Header and the vertical logo tab, with its curved end as on the posts. */
.sc-header { position: relative; z-index: 30; }
.sc-header a { text-decoration: none; }
.wp-block-image.sc-tab { position: absolute; top: 0; right: clamp(16px, 3vw, 44px); width: clamp(44px, 5vw, 60px); margin: 0; z-index: 20; line-height: 0; }
.sc-tab img { width: 100%; height: auto; display: block; }

/* Full-width photo at the top of a page (a normal Cover block). */
.wp-block-cover.sc-hero { min-height: min(82vh, 780px) !important; color: var(--wp--preset--color--milk); padding-bottom: var(--wp--preset--spacing--60); }
.wp-block-cover.sc-hero .wp-block-cover__background { background: linear-gradient(180deg, rgba(43,27,20,.08) 25%, rgba(43,27,20,.6) 62%, rgba(43,27,20,.93) 100%) !important; opacity: 1 !important; }
.wp-block-cover.sc-hero { padding-inline: var(--wp--preset--spacing--40); }
.wp-block-cover.sc-hero.has-custom-content-position .wp-block-cover__inner-container { width: 100% !important; max-width: 1160px; margin: 0 auto !important; }
.sc-hero h1 { margin: 0 0 .35em; max-width: none; }
.sc-hero .wp-block-button:not(.is-style-outline) .wp-element-button { background: var(--wp--preset--color--milk); color: var(--wp--preset--color--espresso); }
.sc-hero .is-style-outline .wp-element-button { background: transparent; border: 1px solid var(--wp--preset--color--milk); color: var(--wp--preset--color--milk); }

/* Sections get room to breathe. */
main > .entry-content > .wp-block-group, .wp-block-post-content > .wp-block-group { padding-top: var(--sc-section) !important; padding-bottom: var(--sc-section) !important; }
.wp-block-column p { max-width: 38em; }
.wp-block-post-content > * { margin-block: 0; }
main.wp-block-group, .wp-block-template-part { margin-block: 0; }
h2.wp-block-heading { margin-bottom: 2rem; }
h3.wp-block-heading { margin-top: 2.5rem; margin-bottom: .75rem; }
.wp-block-columns { gap: clamp(2.5rem, 6vw, 5.5rem); }

/* Text on the dark sections. */
.has-espresso-background-color a:not(.wp-element-button), .has-green-background-color a:not(.wp-element-button), .has-walnut-background-color a:not(.wp-element-button) { color: var(--wp--preset--color--milk); }
.has-espresso-background-color .wp-element-button, .has-green-background-color .wp-element-button { background: var(--wp--preset--color--milk); color: var(--wp--preset--color--espresso); }
.has-espresso-background-color .sc-menu-table td, .has-espresso-background-color .sc-hours th, .has-espresso-background-color .sc-hours td { border-color: rgba(247, 242, 234, .18); }

.wp-block-image { margin: 0; }
.wp-block-image img { width: 100%; display: block; }
.wp-block-gallery.sc-gallery { margin-top: 3rem; gap: clamp(1rem, 3vw, 2.5rem); }

/* A slightly offset second column keeps the page from feeling like a template. */
@media (min-width: 782px) { .wp-block-column.sc-offset { margin-top: clamp(3rem, 8vw, 7rem); } }

.sc-statement p { font-weight: 500; line-height: 1.08; letter-spacing: -0.015em; }

.sc-card { border-top: 1px solid var(--wp--preset--color--line); padding-top: 2rem; }

/* Menu. */
.sc-menu-grid.wp-block-group { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(3.5rem, 7vw, 6rem) clamp(3rem, 7vw, 6.5rem); align-items: start; }
.sc-menu-section { scroll-margin-top: 5rem; }
.sc-menu-section h2 { margin-bottom: .25rem; }
.sc-menu-note { color: var(--wp--preset--color--stone); font-size: var(--wp--preset--font-size--small); margin: 0 0 1.25rem; }
.wp-block-table.sc-menu-table { margin: 0 0 1.5rem; }
.sc-menu-table table { border-collapse: collapse; width: 100%; table-layout: auto; }
.sc-menu-table td { border: 0; border-bottom: 1px solid var(--wp--preset--color--line); padding: .8rem 0; vertical-align: top; }
.sc-menu-table td:last-child { text-align: right; font-weight: 500; white-space: nowrap; padding-left: 1.5rem; }
.sc-menu-table em { font-style: normal; color: var(--wp--preset--color--stone); font-size: var(--wp--preset--font-size--small); }
.wp-block-buttons.sc-menu-jumps { position: sticky; top: 0; z-index: 10; flex-wrap: nowrap; gap: 1.75rem; overflow-x: auto; padding: 1rem 0; margin: clamp(2.5rem, 6vw, 4.5rem) 0; background: var(--wp--preset--color--milk); border-bottom: 1px solid var(--wp--preset--color--line); }
.sc-menu-jumps .wp-element-button { background: none; color: var(--wp--preset--color--walnut); padding: 0; font-weight: 500; white-space: nowrap; }
.sc-menu-jumps .wp-element-button:hover { background: none; color: var(--wp--preset--color--brick); }

/* Hours and the open-now badge. */
.sc-hours { width: 100%; border-collapse: collapse; margin: 1rem 0 1.5rem; }
.sc-hours th, .sc-hours td { text-align: left; padding: .65rem 0; border-bottom: 1px solid var(--wp--preset--color--line); font-weight: 400; }
.sc-hours td { text-align: right; }
.sc-open { display: inline-block; font-size: var(--wp--preset--font-size--small); font-weight: 500; color: var(--wp--preset--color--stone); }
.sc-open::before { content: ""; display: inline-block; width: .55em; height: .55em; margin-right: .5em; border-radius: 50%; background: currentColor; }
.sc-open.is-open { color: var(--wp--preset--color--green); }
.sc-card .wp-block-button__link { display: inline-block; text-decoration: none; }

/* Vibes: words, not boxes. */
.wp-block-list.sc-vibes { list-style: none; padding: 0; margin: 1rem 0 2rem; display: flex; flex-wrap: wrap; gap: .5rem 2rem; font-size: var(--wp--preset--font-size--large); color: var(--wp--preset--color--walnut); }

.sc-footer-strip { background: var(--wp--preset--color--green); color: var(--wp--preset--color--milk); }
.sc-footer-strip p { margin: 0; }
footer.wp-block-group a { color: var(--wp--preset--color--milk); }

a:focus-visible, button:focus-visible { outline: 3px solid var(--wp--preset--color--brick); outline-offset: 2px; }

@media (max-width: 781px) {
	.sc-menu-grid.wp-block-group { grid-template-columns: minmax(0, 1fr); }
	.sc-hero { min-height: 74vh; }
}
@media (max-width: 700px) { .sc-gallery { grid-template-columns: 1fr; } }

/* Fashion-house gravitas (Feroz, 1 November 2026): large photos, refined type, no boxes, few words, lots of space. */
.wp-block-button .wp-element-button { background: none !important; color: inherit !important; border: 0 !important; border-bottom: 1px solid currentColor !important; border-radius: 0; padding: 0 0 .25rem; font-weight: 400; letter-spacing: .04em; }
.sc-hero .wp-block-button .wp-element-button, .has-espresso-background-color .wp-block-button .wp-element-button { color: var(--wp--preset--color--milk) !important; }
.wp-block-buttons { gap: 2.5rem; }
.wp-block-image.sc-full-photo { margin-block: 0; }
.sc-full-photo img { width: 100%; object-position: center 72%; }
.sc-lined .wp-block-column { border-top: 1px solid var(--wp--preset--color--line); padding-top: 1.75rem; }
.sc-lined h3.wp-block-heading { margin-top: 0; }
.sc-card { border-top: 0; padding-top: 0; }
.sc-header { font-size: var(--wp--preset--font-size--small); letter-spacing: .06em; }
h3.wp-block-heading a { color: inherit; text-decoration: none; }
.wp-block-post-content p.has-large-font-size { font-family: var(--wp--preset--font-family--cormorant); line-height: 1.25; }
.sc-hero p { font-family: var(--wp--preset--font-family--cormorant); }
@media (max-width: 781px) { .sc-full-photo img { aspect-ratio: 4 / 5 !important; } }
footer .has-large-font-size { font-family: var(--wp--preset--font-family--cormorant); font-weight: 400 !important; }
.sc-foot-title { font-family: var(--wp--preset--font-family--cormorant); font-size: var(--wp--preset--font-size--large); margin-bottom: .25rem; }
