/* ==========================
   Fonts
   ========================== */

/* Load Oswald (for headings) */
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@600&display=swap');

/* Load Guyot Text Bold */
@font-face {
    font-family: 'Guyot Text';
    src: url('/fonts/GuyotText-Bold.woff2') format('woff2'),
         url('/fonts/GuyotText-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

/* ==========================
   Global Styles
   ========================== */

body {
    background-color: #fff;
    color: rgb(105,77,45); /* default body copy color */
}

a {
    color: rgb(105,77,45);
    text-decoration: none;
}

a:hover,
a:focus {
    text-decoration: underline; /* optional hover underline */
}

a:active { opacity: 0.7; }
.page a.active { opacity: 0.4; }

i, em { font-style: italic; }
b, strong { font-weight: bolder; }

sub, sup { position: relative; vertical-align: baseline; }
sub { top: 0.3em; } sup { top: -0.4em; }

s { text-decoration: line-through; }
img { border: 0; padding: 0; }

ul, ol { margin: 0; padding-left: 1em; }
blockquote { margin: 0; padding-left: 2em; }

hr { background: rgba(127,127,127,0.2); border: 0; height: 1px; display: block; }

.content img { float: none; margin-bottom: .5em; }

.gallery_image_caption {
    margin-top: 1.2rem;
    margin-bottom: 0.5rem;
    font-size: 1.3rem;
    line-height: 1.3;
    font-family: 'Neue Haas Grotesk', Icons;
    font-weight: 400;
    font-style: normal;
    color: rgba(41,41,41,0.3);
}

/* ==========================
   Small Copy / Bodycopy
   ========================== */

[data-predefined-style="true"] bodycopy {
    font-size: 1.4rem;
    font-weight: 400;
    font-family: "Guyot Text", Icons;
    font-style: normal;
    line-height: 1.2;
    letter-spacing: 0.01em;
    color: rgb(105,77,45);
}

[data-predefined-style="true"] bodycopy a {
    color: rgb(105,77,45);
    text-decoration: none;
    border-bottom: 1px solid rgba(0,0,0,0.05); /* subtle underline if needed */
}

[data-predefined-style="true"] small {
    display: inline-block;
    line-height: 1.3;
    font-weight: 400;
    font-style: normal;
    font-size: inherit;      /* editor can adjust size */
    font-family: inherit;    /* editor can adjust font */
    color: inherit;          /* editor can adjust color */
}

[data-predefined-style="true"] small a {
    color: inherit;
    text-decoration: none;
}

/* ==========================
   Audio Player
   ========================== */

.audio-player {
    max-width: 36rem;
    height: 3.3rem;
    outline: 1px solid rgba(0,0,0,0.15);
    background: #fff;
    color: rgba(0,0,0,0.6);
    font-size: 1.2rem;
    line-height: 1.3;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
    font-weight: 400;
    font-style: normal;
    text-align: left;
    margin: 1px 1px 1em 1px;
}

body.mobile .audio-player { max-width: 100%; }

.audio-player .separator { width: 1px; background-color: rgba(0,0,0,0.15); }
.audio-player .button { background: transparent; cursor: pointer; fill: rgba(0,0,0,0.85); }
.audio-player .icon { fill: rgba(0,0,0,0.85); padding: 30%; width: 100%; margin: auto; }
.audio-player .buffer { background: rgba(0,0,0,0.03); }
.audio-player .progress { background: rgba(0,0,0,0.1); }
.audio-player .progress-indicator {
    border: 1px solid rgba(0,0,0,0.7);
    width: 1px; height: 100%;
    right: 0; position: absolute;
    cursor: ew-resize;
}
.audio-player .note-icon { height: 100%; width: 3.8rem; padding: 1rem; fill: rgba(0,0,0,0.5); }

/* ==========================
   Thumbnails
   ========================== */

.thumbnails .thumbnail,
.thumbnails .thumbnail > a {
    position: relative;
    display: block;
    overflow: hidden;
}

.thumbnails .thumbnail img.thumb_image {
    width: 100%;
    height: auto;
    display: block;
    transform: none;
    transition: none;
}

/* Thumbnail spacing */
[data-css-preset] [thumbnails-pad] { padding: 0.6rem; }
[data-css-preset] [thumbnails-gutter] { margin: -0.6rem; }
.thumbnails .thumbnail { padding: 0.6rem; }

/* Orange Overlay */
.thumbnails .thumbnail > a::after {
    content: "";
    position: absolute;
    top:0; left:0; right:0; bottom:0;
    background-color: rgb(220,129,39);
    opacity:0;
    transition: opacity 0.3s ease;
    pointer-events:none;
    z-index:5;
}

/* Overlay Text */
.thumbnails .thumbnail .title {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;

    font-family: 'Guyot Text', sans-serif;
    font-weight: 700;
    font-style: normal;

    color: #fff;
    font-size: 2.5rem;
    text-align: center;
    letter-spacing: 0.02em;
    line-height: 1.1;

    padding: 0.2rem 0.4rem;
    margin: 0;
    background: none !important;
    box-shadow: none !important;

    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

/* Hover effects */
.thumbnails .thumbnail:hover > a::after { opacity: 1; }
.thumbnails .thumbnail:hover .title { opacity: 1; }

body.mobile .thumbnails .thumbnail > a::after,
body.mobile .thumbnails .thumbnail .title { opacity:0 !important; }

/* ==========================
   Headings
   ========================== */

[data-predefined-style="true"] h1 { 
    font-family: Oswald, Icons; 
    font-weight: 600; 
    font-size: 3.5rem; 
    line-height: 1.3; 
    color: rgb(105,77,45); 
    margin:0; padding:0; 
}

[data-predefined-style="true"] h2 { 
    font-family: 'Guyot Text', Icons; 
    font-weight: 700; 
    font-size: 1.8rem; 
    line-height: 1.2; 
    color: rgb(105,77,45); 
    margin:0; padding:0; 
}

/* ==========================
   Global Fixes
   ========================== */

/* Remove underline from navigation links */
#site_menu a,
#shop_button a {
    text-decoration: none;
    color: rgb(105,77,45);
}

/* On hover underline optional */
#site_menu a:hover,
#shop_button a:hover { text-decoration: underline; }

/* ==========================
   Keep existing site menu, shop, quick-view, gallery navigation, wallpaper navigation CSS
   ========================== */
/* No changes here; they stay as-is */
