@charset "UTF-8";
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* Import display and body fonts from Google Fonts */
@import url("https://fonts.googleapis.com/css2?family=Averia+Serif+Libre:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap");
/* Typography
--------------------------------------------- */
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping page-templates
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded page-templates
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type=checkbox],
[type=radio] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}

/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
:root {
  --step--1: clamp(0.9rem, 0.85rem + 0.3vw, 1rem);
  --step-0: clamp(1rem, 0.9rem + 0.5vw, 1.1rem);
  --step-1: clamp(1.25rem, 1rem + 1vw, 1.75rem);
  --step-2: clamp(1.6rem, 1.2rem + 1.8vw, 2.5rem);
  --step-3: clamp(2rem, 1.4rem + 3vw, 4rem);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  clear: both;
  line-height: 1.12;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #0e0e0e;
  text-rendering: optimizeLegibility;
  text-wrap: balance;
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "ss01" 1;
}

h1,
h2,
h3,
h4,
h5 {
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

h1, h2 {
  margin: 0;
  padding: 1rem 0;
}

h1 {
  font-size: var(--step-3);
  font-weight: 800;
}

h2 {
  font-size: var(--step-2);
  font-weight: 800;
}

h3 {
  font-size: var(--step-1);
  font-weight: 700;
}

h4, h5, h6 {
  font-weight: 700;
}

p {
  font-size: var(--step-0);
}

small {
  font-size: var(--step--1);
}

/* Emphasis — strong/bold and em share a tighter, brand-aware treatment */
strong,
b {
  font-weight: 700;
  color: inherit;
  /* Slight contrast lift when appearing in body copy */
  letter-spacing: 0.005em;
}

em,
i {
  font-style: italic;
}

/* Inline code inside prose */
p code,
li code {
  padding: 0.08em 0.38em;
  background: rgba(22, 47, 58, 0.06);
  border: 1px solid rgba(22, 47, 58, 0.1);
  border-radius: 3px;
  font-size: 0.92em;
  color: rgb(22, 47, 58);
}

p {
  margin: 0;
}

.menu {
  padding-top: 1rem;
  padding-left: 1.4rem;
}

body,
button,
input,
select,
optgroup,
textarea {
  color: #2d2d2d;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  line-height: 1.65;
  font-weight: 500;
  letter-spacing: 0.01em;
}

/* Elements
--------------------------------------------- */
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Global box model & body defaults
   ========================================================================== */
:root {
  /* Safe fallback used before JS measures the real header height.
     Covers the enlarged logo lockup before the sticky header collapses. */
  --site-header-offset: 8.5rem;
  --layout-shell-max: 1400px;
  --layout-grid-max: 1440px;
  --layout-content-max: 1200px;
  --layout-copy-max: 860px;
  --layout-gutter: clamp(1rem, 2.4vw, 2rem);
  --layout-edge-padding: max(var(--layout-gutter), calc((100vw - var(--layout-shell-max)) / 2 + var(--layout-gutter)));
}

* {
  box-sizing: border-box;
}

html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--site-header-offset, 8.5rem) + 0.75rem);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}
body {
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  font-kerning: normal;
}

/* Warm selection colour — picks up the brand amber */
::selection {
  background: rgba(227, 190, 49, 0.32);
  color: #0e0e0e;
}

/* ==========================================================================
   Main content area (no-sidebar layouts)
   ========================================================================== */
.site-main {
  background-color: rgba(255, 255, 255, 0.96);
  padding: 2rem 15%;
  min-width: 0;
}

@media screen and (max-width: 1200px) {
  .site-main {
    padding: 2rem 5%;
  }
}
/* ==========================================================================
   Breadcrumbs
   ========================================================================== */
#breadcrumbs {
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at top right, rgba(227, 190, 49, 0.08), transparent 45%), linear-gradient(180deg, rgba(18, 39, 48, 0.985) 0%, rgba(14, 30, 37, 0.985) 100%);
  color: rgba(255, 255, 255, 0.72);
  padding: 0.85rem var(--layout-gutter) 0.9rem;
  padding-inline: var(--layout-edge-padding);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  text-align: left;
  border-top: 1px solid rgba(255, 255, 255, 0.04);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
#breadcrumbs a {
  color: rgb(227, 190, 49);
  text-decoration: none;
  transition: color 0.22s ease;
}
#breadcrumbs a:hover {
  color: #fff;
}

@media screen and (max-width: 768px) {
  #breadcrumbs {
    padding: 0.75rem var(--layout-gutter) 0.8rem;
    font-size: 0.66rem;
    letter-spacing: 0.14em;
  }
}
/* ==========================================================================
   Form wrapper (within content area)
   ========================================================================== */
.form-wrapper {
  width: 100%;
  max-width: 800px;
  border-radius: 8px;
}

/* ==========================================================================
   Contact main area (centres the form within the grid column)
   ========================================================================== */
.contact-main {
  display: flex;
  justify-content: center;
  padding: 0 1rem;
}

/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
hr {
  background-color: #ccc;
  border: 0;
  height: 1px;
  margin-bottom: 1.5em;
}

input[type=text],
input[type=email],
input[type=url],
input[type=password],
input[type=search],
input[type=number],
input[type=tel],
input[type=range],
input[type=date],
input[type=month],
input[type=week],
input[type=time],
input[type=datetime],
input[type=datetime-local],
input[type=color],
select,
textarea {
  padding: 0.6rem 1rem;
  border-radius: 0;
}

textarea {
  width: 100%;
}

/* Prevent iOS Safari from zooming the viewport on focus — triggered when an input's font-size is below 16px */
@media (max-width: 768px) {
  input[type=text],
  input[type=email],
  input[type=url],
  input[type=password],
  input[type=search],
  input[type=number],
  input[type=tel],
  input[type=date],
  input[type=month],
  input[type=week],
  input[type=time],
  input[type=datetime],
  input[type=datetime-local],
  select,
  textarea {
    font-size: 16px;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Buttons — native elements
   ========================================================================== */
button,
input[type=button],
input[type=reset],
input[type=submit] {
  font-weight: bold;
  text-transform: uppercase;
  font-size: clamp(1rem, 0.9rem + 0.5vw, 1.2rem);
  cursor: pointer;
  border-radius: 0;
  overflow: hidden;
}

form button,
form input[type=button],
form input[type=reset],
form input[type=submit] {
  border-radius: 0;
}

.contact-section input[type=submit], .ninja-forms-field input[type=submit] {
  background-color: rgba(227, 190, 49, 0.97);
  border: 1px solid rgb(233.1025641026, 204.1666666667, 93.8974358974);
  color: white;
}
.contact-section input[type=submit]:hover, .ninja-forms-field input[type=submit]:hover {
  background-color: rgba(239.2051282051, 218.3333333333, 138.7948717949, 0.97);
  color: #0e0e0e;
  border-color: rgba(108.2820512821, 88.8333333333, 14.7179487179, 0.97);
}

/* ==========================================================================
   .btn — utility class (anchors, buttons, inputs)
   ========================================================================== */
.btn {
  display: inline-block;
  padding: 0.8rem 2.2rem;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.8px;
  text-decoration: none;
  max-width: 300px;
  text-align: center;
  border-radius: 0;
  cursor: pointer;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
  line-height: 1;
  /* Primary: amber fill — dark text for contrast */
}
.btn--primary {
  background: rgb(227, 190, 49);
  color: #0e0e0e;
  border: 2px solid rgb(227, 190, 49);
}
.btn--primary:hover, .btn--primary:focus {
  background: transparent;
  color: rgb(227, 190, 49);
}
.btn {
  /* Ghost: transparent with white border (for use on dark/hero backgrounds) */
}
.btn--ghost {
  background: transparent;
  color: rgba(255, 255, 255, 0.9);
  border: 2px solid rgba(255, 255, 255, 0.55);
}
.btn--ghost:hover, .btn--ghost:focus {
  border-color: rgb(227, 190, 49);
  color: rgb(227, 190, 49);
}
.btn {
  /* Outline: transparent with amber border (for use on light backgrounds) */
}
.btn--outline {
  background: transparent;
  color: rgb(227, 190, 49);
  border: 2px solid rgb(227, 190, 49);
}
.btn--outline:hover, .btn--outline:focus {
  background: rgb(227, 190, 49);
  color: #0e0e0e;
}
.btn {
  /* Dark: dark fill (for use on light backgrounds) */
}
.btn--dark {
  background: #0e0e0e;
  color: #fff;
  border: 2px solid #0e0e0e;
}
.btn--dark:hover, .btn--dark:focus {
  background: rgb(22, 47, 58);
  border-color: rgb(22, 47, 58);
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object,
video,
canvas,
svg {
  max-width: 100%;
}

img {
  height: auto;
  max-width: 100%;
}

figure {
  margin: 1em 0;
  max-width: 100%;
}

table {
  margin: 0 0 1.5em;
  width: 100%;
  max-width: 100%;
}

th,
td {
  overflow-wrap: anywhere;
}

@media (max-width: 768px) {
  table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Footer CTA — process panel
   Two-column grid: image left / process steps right
   ========================================================================== */
.contact-section {
  position: relative;
  display: grid;
  grid-template-columns: minmax(280px, 0.95fr) minmax(0, 1.05fr);
  min-height: 500px;
  border-top: 1px solid rgba(227, 190, 49, 0.35);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  background: linear-gradient(180deg, rgba(10, 18, 23, 0.98), rgba(8, 14, 17, 0.98)), linear-gradient(90deg, rgba(227, 190, 49, 0.06), transparent 48%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  overflow: hidden;
}
.contact-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at top right, rgba(227, 190, 49, 0.12), transparent 34%), radial-gradient(circle at bottom left, rgba(22, 47, 58, 0.45), transparent 42%);
  pointer-events: none;
}
.contact-section > * {
  position: relative;
  z-index: 1;
  min-width: 0;
}

/* Left panel — photo */
.contact-image {
  background: url("./img/contact.jpg") no-repeat center center/cover;
  position: relative;
}
.contact-image::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(8, 14, 17, 0.08) 0%, rgba(8, 14, 17, 0.56) 100%);
}
.contact-image {
  /* Dark vignette so the panel doesn't feel raw */
}
.contact-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(10, 18, 23, 0.76) 0%, rgba(22, 47, 58, 0.36) 46%, rgba(227, 190, 49, 0.12) 100%);
}

/* ==========================================================================
   Process panel — right side of contact-section
   ========================================================================== */
.process-panel {
  display: grid;
  align-content: center;
  gap: 1.75rem;
  padding: clamp(2.8rem, 5vw, 4.5rem) clamp(1.75rem, 5vw, 4.5rem);
  background: linear-gradient(180deg, rgba(11, 22, 28, 0.96), rgba(9, 18, 22, 0.99));
  color: rgba(240, 240, 240, 0.92);
  position: relative;
  border-left: 1px solid rgba(255, 255, 255, 0.04);
  isolation: isolate;
  /* Subtle amber hairline accent on the left edge */
}
.process-panel::before {
  content: "";
  position: absolute;
  top: 2.4rem;
  left: 0;
  bottom: 2.4rem;
  width: 1px;
  background: linear-gradient(180deg, rgba(227, 190, 49, 0), rgba(227, 190, 49, 0.55), rgba(227, 190, 49, 0));
}
.process-panel > * {
  position: relative;
  z-index: 1;
}
.process-panel__eyebrow {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.32em;
  color: rgb(227, 190, 49);
  margin: 0;
}
.process-panel__title {
  font-size: clamp(1.7rem, 2.8vw, 2.4rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  line-height: 1;
  margin: 0 0 0.5rem;
  color: #fff;
  text-wrap: balance;
}
.process-panel__title::after {
  content: "";
  display: block;
  width: 56px;
  height: 1px;
  background: rgba(227, 190, 49, 0.7);
  margin-top: 1.1rem;
}
.process-panel__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 1.4rem;
  max-width: 460px;
}
.process-panel__step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1.1rem;
  align-items: baseline;
  margin: 0;
  padding: 0;
  position: relative;
}
.process-panel__step-num {
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  color: rgba(227, 190, 49, 0.78);
  line-height: 1;
  padding-top: 0.25rem;
  min-width: 2.2ch;
}
.process-panel__step-body {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.process-panel__step-title {
  font-size: 1rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #fff;
  margin: 0;
  line-height: 1.2;
}
.process-panel__step-copy {
  font-size: 0.92rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.62);
  margin: 0;
}
.process-panel__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  justify-self: start;
  margin-top: 0.5rem;
  padding: 1.05rem 2.4rem;
  background: rgb(227, 190, 49);
  color: #0e0e0e;
  border: 1px solid rgb(227, 190, 49);
  border-radius: 0;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  text-decoration: none;
  transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease, padding 0.3s ease;
}
.process-panel__cta-arrow {
  display: inline-block;
  transition: transform 0.3s ease;
}
.process-panel__cta:hover, .process-panel__cta:focus {
  background: transparent;
  color: rgb(227, 190, 49);
  border-color: rgba(227, 190, 49, 0.7);
}
.process-panel__cta:hover .process-panel__cta-arrow, .process-panel__cta:focus .process-panel__cta-arrow {
  transform: translateX(4px);
}
.process-panel__cta:focus-visible {
  outline: 2px solid rgba(227, 190, 49, 0.5);
  outline-offset: 3px;
}

/* ==========================================================================
   Contact page — keeps the single-column page layout used previously
   ========================================================================== */
.page-contact-us .page-layout {
  grid-template-columns: minmax(0, 1fr);
  max-width: 960px;
}
.page-contact-us .page-layout > .site-main {
  padding-right: 0;
}
.page-contact-us .sidebar,
.page-contact-us .right-sidebar {
  display: none;
}
.page-contact-us .entry-content.two-col p {
  column-count: 1;
}
.page-contact-us .nf-form-cont {
  max-width: 100%;
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 900px) {
  .contact-section {
    grid-template-columns: 1fr;
  }
  .contact-image {
    min-height: 240px;
  }
  .process-panel {
    padding: 2.4rem 1.5rem;
    border-left: 0;
  }
  .process-panel::before {
    display: none;
  }
}
@media (max-width: 600px) {
  .contact-image {
    display: none;
  }
  .process-panel__title::after {
    margin-top: 0.85rem;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Global Refinements
   Subtle finishing touches that polish the theme without overriding
   page-specific styles. Applied theme-wide.
   ========================================================================== */
/* Keyboard focus — consistent, brand-aware ring replacing browser default.
   Uses :focus-visible so mouse clicks don't show the ring. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid rgba(227, 190, 49, 0.85);
  outline-offset: 2px;
  border-radius: 2px;
}

/* Remove the legacy dotted outline from _links.scss in favour of :focus-visible */
a:focus {
  outline: none;
}

/* Smoother image rendering on dense displays */
img {
  image-rendering: -webkit-optimize-contrast;
}

/* Lists inside prose: tighten the rhythm, brand-coloured marker */
.entry-content ul,
.entry-content ol {
  padding-left: 1.35rem;
}
.entry-content ul li,
.entry-content ol li {
  padding-left: 0.25rem;
  line-height: 1.7;
}
.entry-content ul li + li,
.entry-content ol li + li {
  margin-top: 0.45rem;
}
.entry-content ul li::marker,
.entry-content ol li::marker {
  color: rgba(227, 190, 49, 0.85);
}
.entry-content {
  /* Prose links — warm amber underline that thickens on hover */
}
.entry-content a:not([class]) {
  color: rgb(22, 47, 58);
  text-decoration: underline;
  text-decoration-color: rgba(227, 190, 49, 0.55);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.22em;
  transition: color 0.2s ease, text-decoration-color 0.2s ease, text-decoration-thickness 0.2s ease;
}
.entry-content a:not([class]):hover, .entry-content a:not([class]):focus-visible {
  color: rgb(227, 190, 49);
  text-decoration-color: rgb(227, 190, 49);
  text-decoration-thickness: 2px;
}
.entry-content {
  /* Prose emphasis — subtle amber highlight for strong */
}
.entry-content strong {
  color: #0e0e0e;
}

/* Shared button glimmer — uses the site-header CTA sweep across buttons
   and button-like links. Because the resting state lives off-canvas to the
   left, the same transition also reads as a glimmer when the pointer leaves. */
:where(.site-header__cta,
.btn,
button:not(.menu-toggle):not(.mobile-nav__close),
input[type=button],
input[type=reset],
input[type=submit],
.mobile-nav__cta,
.single-post-sidebar__cta,
.archive-wrapper--portfolio .portfolio-filter-chip,
.portfolio-taxonomy-link,
.portfolio-entry__eyebrow-link,
.page-numbers:not(.dots)) {
  position: relative;
  overflow: hidden;
}
:where(.site-header__cta,
.btn,
button:not(.menu-toggle):not(.mobile-nav__close),
input[type=button],
input[type=reset],
input[type=submit],
.mobile-nav__cta,
.single-post-sidebar__cta,
.archive-wrapper--portfolio .portfolio-filter-chip,
.portfolio-taxonomy-link,
.portfolio-entry__eyebrow-link,
.page-numbers:not(.dots))::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 0%, rgba(255, 255, 255, 0.18) 45%, transparent 70%);
  transform: translateX(-120%);
  transition: transform 0.65s ease;
  pointer-events: none;
}
:where(.site-header__cta,
.btn,
button:not(.menu-toggle):not(.mobile-nav__close),
input[type=button],
input[type=reset],
input[type=submit],
.mobile-nav__cta,
.single-post-sidebar__cta,
.archive-wrapper--portfolio .portfolio-filter-chip,
.portfolio-taxonomy-link,
.portfolio-entry__eyebrow-link,
.page-numbers:not(.dots)):hover::after, :where(.site-header__cta,
.btn,
button:not(.menu-toggle):not(.mobile-nav__close),
input[type=button],
input[type=reset],
input[type=submit],
.mobile-nav__cta,
.single-post-sidebar__cta,
.archive-wrapper--portfolio .portfolio-filter-chip,
.portfolio-taxonomy-link,
.portfolio-entry__eyebrow-link,
.page-numbers:not(.dots)):focus-visible::after {
  transform: translateX(120%);
}

/* Menu toggle — larger tap target on small phones */
@media (max-width: 420px) {
  .menu-toggle {
    min-height: 3rem;
    min-width: 3rem;
  }
}
/* Post-card titles: subtle amber underline on hover for affordance */
.post-card__link:hover .post-card__title,
.post-card__link:focus-visible .post-card__title {
  background-image: linear-gradient(90deg, rgba(227, 190, 49, 0.85), rgba(227, 190, 49, 0.25));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% 1px;
  padding-bottom: 2px;
}

/* Breadcrumbs — soften shift between hero and content */
#breadcrumbs {
  font-weight: 600;
}

/* Section eyebrows on landing — warm underline refinement */
.section__eyebrow {
  font-weight: 800;
}

/* Scrollbar styling (webkit / firefox) — timber-warm tones */
@supports (scrollbar-color: auto) {
  html {
    scrollbar-color: rgba(22, 47, 58, 0.5) rgba(22, 47, 58, 0.06);
  }
}
/* Pagination refinement — amber ring on focus */
.page-numbers:focus-visible {
  outline-offset: 3px;
}

/* Blockquote base — a tasteful carpenter's rule */
blockquote {
  position: relative;
  margin: 1.5rem 0;
  padding-left: 1.25rem;
  border-left: 2px solid rgba(227, 190, 49, 0.7);
  color: rgba(37, 37, 37, 0.85);
  font-style: italic;
  line-height: 1.7;
}

/* Footer copyright subtle refinement */
.site-footer .site-info .copyright {
  opacity: 0.72;
}

/* Ensure images/videos never break layout */
img,
svg,
video,
iframe,
embed,
object {
  max-width: 100%;
  height: auto;
}

/* WP block spacing normalisation inside prose */
.entry-content > * + * {
  margin-top: 1.15rem;
}

/* Subtle hr — replaces the default grey line with a brand-aware rule */
hr {
  height: 1px;
  border: 0;
  background: linear-gradient(90deg, transparent, rgba(22, 47, 58, 0.18) 20%, rgba(227, 190, 49, 0.55) 50%, rgba(22, 47, 58, 0.18) 80%, transparent);
  margin: 2rem 0;
}

/* Skip-link — keyboard accessibility polish */
.skip-link,
a.skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.skip-link:focus,
a.skip-link:focus {
  left: 1rem;
  top: 1rem;
  width: auto;
  height: auto;
  padding: 0.6rem 1rem;
  background: rgb(227, 190, 49);
  color: #0e0e0e;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 0.75rem;
  z-index: 10000;
  border-radius: 2px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
}

/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Hero — Base (shared between landing + inner pages)
   ==========================================================================
   Structure expected in PHP:
     <section class="hero hero__landing | hero__main">
       <div class="hero__bg" style="background-image: url(...)"></div>
       <div class="hero__overlay"></div>
       <div class="hero-text-container">...</div>
     </section>
   ========================================================================== */
.hero {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  color: white;
  background: radial-gradient(circle at top, rgba(255, 255, 255, 0.14), transparent 46%), linear-gradient(180deg, rgba(9, 17, 23, 0.82), rgba(9, 17, 23, 0.94));
  /* Background image layer — JS parallax targets #parallaxBg */
}
.hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  will-change: transform;
  z-index: 0;
  transform: scale(1.02);
  filter: saturate(1.08) contrast(1.05) brightness(0.9);
  transition: transform 0.7s ease, filter 0.7s ease;
}
.hero__bg--fallback {
  background: radial-gradient(circle at 20% 20%, rgba(227, 190, 49, 0.18), transparent 30%), linear-gradient(145deg, rgba(22, 47, 58, 0.96), rgba(15, 18, 20, 0.94));
}
.hero__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center center;
  z-index: 0;
  transform: scale(1.02);
  filter: saturate(1.08) contrast(1.05) brightness(0.92);
  transition: transform 0.7s ease, filter 0.7s ease;
}
.hero {
  /* Lighter directional veil so landscape photography still carries the hero */
}
.hero__overlay {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 72% 58% at 16% 84%, rgba(227, 190, 49, 0.26) 0%, transparent 56%), radial-gradient(ellipse 55% 40% at 82% 18%, rgba(255, 255, 255, 0.16) 0%, transparent 54%), linear-gradient(142deg, rgba(10, 24, 34, 0.78) 0%, rgba(10, 18, 26, 0.56) 46%, rgba(16, 29, 38, 0.74) 100%);
  z-index: 1;
  pointer-events: none;
}
.hero {
  /* Text / content area sits above both layers */
}
.hero-text-container {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1rem;
  width: fit-content;
  max-width: calc(100% - 2rem);
  padding: 2rem;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 0;
  background: linear-gradient(145deg, rgba(9, 18, 26, 0.52), rgba(9, 18, 26, 0.28));
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.hero__title {
  font-size: clamp(2.2rem, 7vw, 5rem);
  color: rgba(255, 255, 255, 0.98);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: clamp(0.08em, 0.22vw, 0.18em);
  line-height: 0.98;
  margin: 0;
  text-shadow: 0 10px 30px rgba(0, 0, 0, 0.44), 0 2px 10px rgba(0, 0, 0, 0.38);
  max-width: 13ch;
}
.hero__blurb {
  position: relative;
  font-size: clamp(1.14rem, 2.16vw, 1.5rem);
  color: rgba(255, 255, 255, 0.94);
  max-width: 38rem;
  margin: 0;
  padding-top: 1.4rem;
  line-height: 1.6;
  font-weight: 500;
  letter-spacing: clamp(0.06em, 0.14vw, 0.1em);
  text-transform: uppercase;
  text-wrap: balance;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.42), 0 1px 2px rgba(0, 0, 0, 0.3);
  /* Amber accent bar — echoes the brand underline pattern used on inner-page titles */
}
.hero__blurb::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 56px;
  height: 2px;
  background: linear-gradient(to right, transparent 0%, rgb(227, 190, 49) 20%, rgb(227, 190, 49) 80%, transparent 100%);
  border-radius: 2px;
  box-shadow: 0 0 18px rgba(227, 190, 49, 0.5);
}
.hero__cta {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 0.75rem;
}

/* ==========================================================================
   Hero — Landing Page (full viewport height)
   ========================================================================== */
.hero__landing {
  min-height: 560px;
  min-height: max(560px, 100svh);
  min-height: max(560px, 100dvh);
  padding: calc(var(--site-header-offset, 8.5rem) + clamp(0.75rem, 2.5vh, 1.5rem)) 0 clamp(2rem, 6vh, 4.5rem);
}
.hero__landing .hero-text-container {
  text-transform: uppercase;
}
.hero__landing {
  /* Landing-only: widen the hero text container by ~20% via its content bounds
     (container uses width: fit-content, so it grows with its inner caps) */
}
.hero__landing .hero__title {
  max-width: 15.6ch;
}
.hero__landing .hero__blurb {
  max-width: 45.6rem;
}
.hero__landing .hero__bg {
  background-attachment: fixed;
  transform: none;
}
.hero__landing {
  /* Bottom vignette — softens the transition to page body */
}
.hero__landing::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 180px;
  background: linear-gradient(to bottom, transparent, rgba(6, 3, 1, 0.42));
  z-index: 2;
  pointer-events: none;
}

/* ==========================================================================
   Hero — Inner Pages (50vh, left-anchored title)
   ========================================================================== */
.hero__main {
  height: 50vh;
  min-height: 280px;
  max-height: 480px;
  justify-content: flex-start;
  align-items: flex-end;
  /* Directional overlay: heavier on the left where title sits */
}
.hero__main .hero__overlay {
  background: linear-gradient(90deg, rgba(5, 12, 18, 0.1), transparent 54%), linear-gradient(135deg, rgba(7, 18, 28, 0.78) 0%, rgba(8, 18, 28, 0.54) 48%, rgba(15, 27, 35, 0.28) 100%);
}
.hero__main {
  /* Amber accent line at base */
}
.hero__main::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(to right, transparent 0%, rgb(227, 190, 49) 20%, rgb(227, 190, 49) 80%, transparent 100%);
  z-index: 3;
}
.hero__main {
  /* Left-aligned text block */
}
.hero__main .hero-text-container {
  text-align: left;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 1.5rem clamp(1.5rem, 4vw, 3rem);
  width: fit-content;
  max-width: min(38rem, 100% - 2 * var(--layout-gutter));
  margin: 0 var(--layout-gutter) 2.25rem;
  margin-left: var(--layout-edge-padding);
}
.hero__main .hero__title {
  font-size: clamp(1.8rem, 4.5vw, 4rem);
  letter-spacing: clamp(0.07em, 0.18vw, 0.12em);
  text-shadow: 0 10px 30px rgba(0, 0, 0, 0.36), 0 2px 10px rgba(0, 0, 0, 0.28);
  /* Decorative amber underline beneath the title */
}
.hero__main .hero__title::after {
  content: "";
  display: block;
  width: 72px;
  height: 3px;
  background: rgb(227, 190, 49);
  margin-top: 0.9rem;
  border-radius: 2px;
  box-shadow: 0 0 18px rgba(227, 190, 49, 0.42);
}

.hero__main--single-post::after {
  display: none;
}

.hero__main--single-post::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.24);
  z-index: 1;
  pointer-events: none;
}

.hero__main--single-post .hero__image {
  filter: grayscale(1) blur(3px);
  transform: scale(1.04);
  transform-origin: center;
}

/* ==========================================================================
   Responsive overrides
   ========================================================================== */
/* Tablet + mobile: touch devices don't honour background-attachment: fixed,
   which breaks the parallax. Apply the mobile hero treatment up to tablet width. */
@media (max-width: 1024px) {
  .hero__landing {
    padding: 0;
  }
  .hero__landing .hero-text-container {
    margin: 0 auto;
  }
  .hero__landing .hero__bg {
    background-attachment: scroll;
    background-position: center center;
  }
  .hero-text-container {
    padding: 1.25rem;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }
  .hero__title {
    max-width: none;
  }
}
@media (max-width: 768px) {
  .hero__main {
    align-items: center;
    justify-content: center;
    /* Give the centred title a bit more breathing room from the header */
    min-height: 320px;
  }
  .hero__main .hero-text-container {
    text-align: center;
    align-items: center;
    margin: 0 1rem;
    margin-top: 4rem;
    max-width: calc(100% - 2rem);
    padding: 1.25rem;
  }
  .hero__main .hero__title::after {
    margin: 0.65rem auto 0;
  }
}
/* _hero-main.scss
   Placeholder — .hero__main styles live in _hero-landing.scss
   (kept for import structure; add page-type-specific hero variants here) */
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Hero slider — full-width hero carousel used on service and portfolio pages.
   Paired with src/js/hero-slider.js.
   ========================================================================== */
.hero-slider {
  --hero-slider-min-h: clamp(54vh, 62vh, 720px);
  --hero-slider-edge: clamp(1.25rem, 4vw, 3rem);
  position: relative;
  width: 100vw;
  margin-inline: calc(50% - 50vw);
  min-height: var(--hero-slider-min-h);
  padding-top: calc(var(--site-header-offset, 8.5rem) + clamp(1rem, 3vw, 2.5rem));
  padding-bottom: clamp(2.5rem, 5vw, 4rem);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  isolation: isolate;
  color: #fff;
  background: #0a1217;
  /* Allow the section to take the focus ring */
}
.hero-slider:focus-within {
  outline: none;
}
.hero-slider {
  /* When only one image, hide nav/dot/play affordances */
}
.hero-slider--single .hero-slider__nav,
.hero-slider--single .hero-slider__dots,
.hero-slider--single .hero-slider__meta,
.hero-slider--single .hero-slider__progress,
.hero-slider--single .hero-slider__playpause {
  display: none;
}

/* ---------- Viewport + track ---------- */
.hero-slider__viewport {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  touch-action: pan-y;
  cursor: grab;
}
.hero-slider__viewport:active {
  cursor: grabbing;
}

.hero-slider__track {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hero-slider__slide {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.9s cubic-bezier(0.4, 0, 0.2, 1);
}
.hero-slider__slide.is-active {
  opacity: 1;
  pointer-events: auto;
  z-index: 1;
}
.hero-slider__slide {
  /* Odd-count slides (the last pair has only one image) span the full width. */
}
.hero-slider__slide--single {
  grid-template-columns: 1fr;
}

.hero-slider__cell {
  position: relative;
  overflow: hidden;
  /* Thin gold seam between the two images */
}
.hero-slider__cell:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 8%;
  bottom: 8%;
  right: -1px;
  width: 1px;
  background: linear-gradient(180deg, rgba(227, 190, 49, 0), rgba(227, 190, 49, 0.6), rgba(227, 190, 49, 0));
  z-index: 2;
  pointer-events: none;
}
.hero-slider__cell .hero-slider__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  transform: scale(1.04);
  transition: transform 8s cubic-bezier(0.22, 1, 0.36, 1);
  filter: saturate(1.06) contrast(1.04);
}

.hero-slider__slide.is-active .hero-slider__cell .hero-slider__image {
  transform: scale(1);
}

/* Subtle stagger so the two cells don't feel mechanically identical */
.hero-slider__slide.is-active .hero-slider__cell--2 .hero-slider__image {
  transition-delay: 0.15s;
}

@media (prefers-reduced-motion: reduce) {
  .hero-slider__slide,
  .hero-slider__cell .hero-slider__image {
    transition: none;
  }
  .hero-slider__slide.is-active .hero-slider__cell .hero-slider__image {
    transform: none;
  }
}
@media (max-width: 720px) {
  /* On mobile a half-width cell is too narrow to read — stack the pair
     vertically inside the same slide instead. Both images remain visible. */
  .hero-slider__slide {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 1px;
  }
  .hero-slider__slide--single {
    grid-template-rows: 1fr;
  }
  /* Replace the vertical seam with a horizontal one */
  .hero-slider__cell:not(:last-child)::after {
    top: auto;
    bottom: -1px;
    right: 8%;
    left: 8%;
    width: auto;
    height: 1px;
    background: linear-gradient(90deg, rgba(227, 190, 49, 0), rgba(227, 190, 49, 0.6), rgba(227, 190, 49, 0));
  }
}
/* ---------- Gradient veil so text remains legible ---------- */
.hero-slider__overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: radial-gradient(ellipse 80% 60% at 15% 90%, rgba(0, 0, 0, 0.55) 0%, transparent 58%), radial-gradient(ellipse 60% 40% at 85% 10%, rgba(227, 190, 49, 0.16) 0%, transparent 56%), linear-gradient(180deg, rgba(7, 14, 19, 0.42) 0%, rgba(7, 14, 19, 0.15) 38%, rgba(7, 14, 19, 0.78) 100%);
}

/* ---------- Title / eyebrow ---------- */
.hero-slider__copy {
  position: relative;
  z-index: 4;
  width: 100%;
  max-width: var(--layout-grid-max, 1440px);
  margin: 0 auto;
  padding-inline: var(--hero-slider-edge);
  display: grid;
  gap: 0.85rem;
  justify-items: start;
}

.hero-slider__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.4rem 0.9rem;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.88);
  background: rgba(7, 14, 19, 0.55);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(227, 190, 49, 0.32);
  border-radius: 999px;
}

.hero-slider__title {
  margin: 0;
  font-size: clamp(2rem, 4.6vw, 4rem);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -0.01em;
  text-wrap: balance;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.32);
}

/* ---------- Prev / next buttons ---------- */
.hero-slider__nav {
  position: absolute;
  top: 50%;
  z-index: 5;
  width: 3.2rem;
  height: 3.2rem;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 50%;
  background: rgba(7, 14, 19, 0.42);
  color: rgba(255, 255, 255, 0.92);
  cursor: pointer;
  transform: translateY(-50%);
  backdrop-filter: blur(10px);
  transition: background 0.22s ease, border-color 0.22s ease, color 0.22s ease, transform 0.22s ease, opacity 0.22s ease;
}
.hero-slider__nav:hover, .hero-slider__nav:focus-visible {
  background: rgba(227, 190, 49, 0.92);
  border-color: rgba(227, 190, 49, 0.92);
  color: #0e0e0e;
}
.hero-slider__nav:focus-visible {
  outline: 2px solid rgba(227, 190, 49, 0.6);
  outline-offset: 4px;
}
.hero-slider__nav--prev {
  left: var(--hero-slider-edge);
}
.hero-slider__nav--next {
  right: var(--hero-slider-edge);
}
.hero-slider__nav--prev:hover, .hero-slider__nav--prev:focus-visible {
  transform: translateY(-50%) translateX(-3px);
}
.hero-slider__nav--next:hover, .hero-slider__nav--next:focus-visible {
  transform: translateY(-50%) translateX(3px);
}

/* ---------- Counter ---------- */
.hero-slider__meta {
  position: absolute;
  top: calc(var(--site-header-offset, 8.5rem) + 1.5rem);
  right: var(--hero-slider-edge);
  z-index: 5;
  display: inline-flex;
  align-items: center;
  padding: 0.45rem 0.85rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  background: rgba(7, 14, 19, 0.6);
  backdrop-filter: blur(8px);
  color: rgba(255, 255, 255, 0.84);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  font-variant-numeric: tabular-nums;
}

.hero-slider__counter {
  display: inline-flex;
  align-items: baseline;
  gap: 0.32rem;
}

.hero-slider__counter-sep {
  opacity: 0.4;
}

.hero-slider__counter-num--total {
  color: rgb(227, 190, 49);
}

/* ---------- Dots ---------- */
.hero-slider__dots {
  position: absolute;
  bottom: calc(clamp(2.5rem, 5vw, 4rem) - 1.4rem);
  left: 50%;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  transform: translateX(-50%);
}

.hero-slider__dot {
  width: 26px;
  height: 4px;
  padding: 0;
  border: 0;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.28);
  cursor: pointer;
  transition: background 0.3s ease, width 0.3s ease;
}
.hero-slider__dot.is-active {
  background: rgb(227, 190, 49);
  width: 42px;
}
.hero-slider__dot:hover, .hero-slider__dot:focus-visible {
  background: rgba(255, 255, 255, 0.6);
}
.hero-slider__dot.is-active:hover, .hero-slider__dot.is-active:focus-visible {
  background: rgb(227, 190, 49);
}
.hero-slider__dot:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.45);
  outline-offset: 3px;
}

/* ---------- Autoplay progress ---------- */
.hero-slider__progress {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 5;
  height: 2px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
}

.hero-slider__progress-bar {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, rgb(227, 190, 49) 0%, rgba(227, 190, 49, 0.7) 100%);
  transform-origin: left center;
  transform: scaleX(0);
  will-change: transform;
}

/* When paused, dim the bar so it's clear autoplay is off */
.hero-slider.is-paused .hero-slider__progress-bar {
  opacity: 0.35;
}

/* ---------- Play / pause toggle ---------- */
.hero-slider__playpause {
  position: absolute;
  bottom: calc(clamp(2.5rem, 5vw, 4rem) - 1rem);
  right: var(--hero-slider-edge);
  z-index: 5;
  width: 2.6rem;
  height: 2.6rem;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 50%;
  background: rgba(7, 14, 19, 0.55);
  color: rgba(255, 255, 255, 0.88);
  cursor: pointer;
  backdrop-filter: blur(8px);
  transition: background 0.22s ease, border-color 0.22s ease, color 0.22s ease;
}
.hero-slider__playpause:hover, .hero-slider__playpause:focus-visible {
  background: rgba(227, 190, 49, 0.85);
  border-color: rgba(227, 190, 49, 0.92);
  color: #0e0e0e;
}
.hero-slider__playpause:focus-visible {
  outline: 2px solid rgba(227, 190, 49, 0.6);
  outline-offset: 3px;
}
.hero-slider__playpause {
  /* Show pause icon by default; play icon shows when paused */
}
.hero-slider__playpause .hero-slider__icon--play {
  display: none;
}
.hero-slider__playpause .hero-slider__icon--pause {
  display: block;
}

.hero-slider.is-paused .hero-slider__playpause .hero-slider__icon--play {
  display: block;
}
.hero-slider.is-paused .hero-slider__playpause .hero-slider__icon--pause {
  display: none;
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .hero-slider {
    --hero-slider-min-h: clamp(46vh, 56vh, 560px);
  }
  .hero-slider__nav {
    width: 2.6rem;
    height: 2.6rem;
  }
  .hero-slider__meta {
    top: calc(var(--site-header-offset, 8.5rem) + 1rem);
    font-size: 0.65rem;
    padding: 0.35rem 0.7rem;
  }
  .hero-slider__dots {
    bottom: calc(clamp(2rem, 5vw, 3rem) - 1.1rem);
  }
}
@media (max-width: 600px) {
  .hero-slider__nav {
    display: none;
  }
  .hero-slider__dot {
    width: 18px;
  }
  .hero-slider__dot.is-active {
    width: 28px;
  }
  .hero-slider__playpause {
    width: 2.2rem;
    height: 2.2rem;
    right: 1rem;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Page Layout — Content + Right Sidebar (CSS Grid)
   Used by: page.php, page-templates/service.php
   ========================================================================== */
/* Outer wrapper — sets background and spacing before the grid */
.page-wrapper {
  background-color: rgba(255, 255, 255, 0.96);
  padding: 3rem 0 0;
}

/* Two-column CSS Grid: main content left, sidebar right */
.page-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  grid-template-rows: auto;
  gap: 3rem;
  max-width: var(--layout-grid-max);
  margin: 0 auto;
  padding: 2.5rem var(--layout-gutter) 4rem;
}
.page-layout > * {
  min-width: 0;
}
.page-layout {
  /* Named grid areas for clarity */
}
.page-layout .site-main {
  grid-column: 1;
}
.page-layout .sidebar {
  grid-column: 2;
}
.page-layout {
  /* Reset .site-main's global 15% padding — the grid already constrains width.
     Content gets room to breathe without compressing into a tiny strip. */
}
.page-layout > .site-main {
  padding: 2rem 1.5rem 2rem 0;
  background: transparent; /* .page-wrapper provides the background */
}

@media (max-width: 1280px) {
  .page-layout {
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 2rem;
  }
}
/* Generic page content wrapper — use instead of contact-specific .form-wrapper */
.page-content {
  width: 100%;
  max-width: 100%;
}

/* ==========================================================================
   Sidebar panel
   ========================================================================== */
.right-sidebar,
.sidebar {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.right-sidebar {
  position: relative;
  gap: 0;
  padding: 0;
  color: #f5f5f5;
  background: linear-gradient(180deg, rgba(18, 39, 48, 0.985) 0%, rgba(14, 30, 37, 0.985) 100%);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 0;
  box-shadow: 0 20px 44px rgba(15, 27, 34, 0.22);
  align-self: start;
}
.right-sidebar::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 2px;
  background: linear-gradient(180deg, rgba(227, 190, 49, 0.95), rgba(227, 190, 49, 0.18));
}
.right-sidebar::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 180px;
  height: 180px;
  background: radial-gradient(circle at top right, rgba(227, 190, 49, 0.08), transparent 74%);
  pointer-events: none;
}
.right-sidebar > * {
  position: relative;
  z-index: 1;
  padding: 1.45rem 1.45rem 1.55rem 1.85rem;
}
.right-sidebar > * + * {
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}
.right-sidebar {
  /* Widget titles */
}
.right-sidebar .widget-title,
.right-sidebar h3 {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.8rem;
  font-size: clamp(1.05rem, 0.9rem + 0.75vw, 1.3rem);
  font-weight: 800;
  text-transform: uppercase;
  line-height: 1.15;
  letter-spacing: 0.18em;
  color: #fff;
  margin: 0 0 1.15rem;
}
.right-sidebar .widget-title::after,
.right-sidebar h3::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  min-width: 2.75rem;
  background: linear-gradient(90deg, rgba(227, 190, 49, 0.75), rgba(227, 190, 49, 0.08));
}
.right-sidebar h2 {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.8rem;
  font-size: clamp(1.05rem, 0.9rem + 0.75vw, 1.3rem);
  font-weight: 800;
  text-transform: uppercase;
  line-height: 1.15;
  letter-spacing: 0.18em;
  color: #fff;
  margin: 0 0 1.15rem;
}
.right-sidebar h2::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  min-width: 2.75rem;
  background: linear-gradient(90deg, rgba(227, 190, 49, 0.75), rgba(227, 190, 49, 0.08));
}
.right-sidebar a {
  color: rgba(255, 255, 255, 0.84);
  text-decoration: none;
}
.right-sidebar p,
.right-sidebar li,
.right-sidebar label,
.right-sidebar .textwidget,
.right-sidebar .wp-block-latest-posts__post-excerpt {
  color: rgba(255, 255, 255, 0.56);
}
.right-sidebar .search-form {
  display: grid;
  gap: 0.7rem;
}
.right-sidebar .search-field {
  width: 100%;
  min-height: 50px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.02));
  color: #fff;
  padding: 0.95rem 1rem;
  font-size: 0.9rem;
}
.right-sidebar .search-field::placeholder {
  color: rgba(255, 255, 255, 0.38);
}
.right-sidebar .search-field:focus {
  outline: none;
  border-color: rgba(227, 190, 49, 0.58);
  box-shadow: 0 0 0 3px rgba(227, 190, 49, 0.12);
}
.right-sidebar .search-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  width: 100%;
  border: 1px solid rgba(227, 190, 49, 0.26);
  border-radius: 0;
  background: rgba(227, 190, 49, 0.14);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  transition: border-color 0.22s ease, background 0.22s ease, color 0.22s ease, transform 0.22s ease;
}
.right-sidebar .search-submit:hover, .right-sidebar .search-submit:focus {
  outline: none;
  border-color: rgba(227, 190, 49, 0.72);
  background: rgba(227, 190, 49, 0.22);
  color: rgb(227, 190, 49);
  transform: translateY(-1px);
}
.right-sidebar .widget_search,
.right-sidebar .widget_block .wp-block-search {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  margin: 0.9rem 0.85rem;
  padding: 1.55rem 1.3rem 1.4rem 1.45rem;
  border: 1px solid rgba(227, 190, 49, 0.18);
  border-radius: 0;
  background: radial-gradient(circle at top right, rgba(227, 190, 49, 0.22), transparent 40%), linear-gradient(150deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.03) 20%, rgba(9, 21, 27, 0.92) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 24px 42px rgba(4, 12, 17, 0.3);
  backdrop-filter: blur(8px);
  transition: transform 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease;
}
.right-sidebar .widget_search:hover, .right-sidebar .widget_search:focus-within,
.right-sidebar .widget_block .wp-block-search:hover,
.right-sidebar .widget_block .wp-block-search:focus-within {
  transform: translateY(-2px);
  border-color: rgba(227, 190, 49, 0.34);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.11), 0 30px 52px rgba(4, 12, 17, 0.36);
}
.right-sidebar .widget_search::before,
.right-sidebar .widget_block .wp-block-search::before {
  content: "";
  position: absolute;
  inset: auto -24% -48% 34%;
  height: 150px;
  background: radial-gradient(circle, rgba(227, 190, 49, 0.3), transparent 72%);
  opacity: 0.9;
  pointer-events: none;
  z-index: 0;
}
.right-sidebar .widget_search::after,
.right-sidebar .widget_block .wp-block-search::after {
  content: "Quick Find";
  position: absolute;
  top: 1rem;
  right: 1rem;
  padding: 0.38rem 0.72rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  pointer-events: none;
  z-index: 1;
}
.right-sidebar .widget_search {
  border-top: 0;
}
.right-sidebar .widget_search .widget-title,
.right-sidebar .widget_block .wp-block-search__label {
  position: relative;
  z-index: 1;
  max-width: calc(100% - 6rem);
  margin-bottom: 1.1rem;
}
.right-sidebar .widget_search .search-form,
.right-sidebar .widget_block .wp-block-search__inside-wrapper {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: stretch;
  gap: 0.85rem;
}
.right-sidebar .widget_search .search-form label,
.right-sidebar .widget_block .wp-block-search__inside-wrapper {
  position: relative;
  min-width: 0;
}
.right-sidebar .widget_search .search-form label::before,
.right-sidebar .widget_block .wp-block-search__inside-wrapper::before {
  content: "";
  position: absolute;
  left: 1.15rem;
  top: 50%;
  width: 0.95rem;
  height: 0.95rem;
  border: 2px solid rgba(255, 255, 255, 0.72);
  border-radius: 999px;
  opacity: 0.7;
  pointer-events: none;
  transform: translateY(-58%);
}
.right-sidebar .widget_search .search-form label::after,
.right-sidebar .widget_block .wp-block-search__inside-wrapper::after {
  content: "";
  position: absolute;
  left: 2.02rem;
  top: calc(50% + 0.5rem);
  width: 0.5rem;
  height: 2px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  opacity: 0.7;
  pointer-events: none;
  transform: rotate(45deg);
}
.right-sidebar .widget_search .search-field,
.right-sidebar .widget_block .wp-block-search__input {
  width: 100%;
  min-width: 0;
  min-height: 58px;
  margin: 0;
  padding: 1rem 1.15rem 1rem 3.2rem;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.04));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
  color: #fff;
  font-size: 0.96rem;
  font-weight: 500;
  letter-spacing: 0.02em;
}
.right-sidebar .widget_search .search-field::placeholder,
.right-sidebar .widget_block .wp-block-search__input::placeholder {
  color: rgba(255, 255, 255, 0.46);
}
.right-sidebar .widget_search .search-field::-webkit-search-decoration, .right-sidebar .widget_search .search-field::-webkit-search-cancel-button,
.right-sidebar .widget_block .wp-block-search__input::-webkit-search-decoration,
.right-sidebar .widget_block .wp-block-search__input::-webkit-search-cancel-button {
  display: none;
}
.right-sidebar .widget_search .search-field:focus,
.right-sidebar .widget_block .wp-block-search__input:focus {
  outline: none;
  border-color: rgba(227, 190, 49, 0.72);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.17), rgba(255, 255, 255, 0.06));
  box-shadow: 0 0 0 4px rgba(227, 190, 49, 0.14), 0 16px 28px rgba(227, 190, 49, 0.08);
}
.right-sidebar .widget_search .search-submit,
.right-sidebar .widget_block .wp-block-search__button {
  position: relative;
  width: auto;
  min-width: 7.35rem;
  min-height: 58px;
  margin: 0;
  padding: 0 1.35rem;
  border: 0;
  border-radius: 0;
  background: rgb(227, 190, 49);
  color: rgb(22, 47, 58);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.36), 0 18px 32px rgba(227, 190, 49, 0.2);
  overflow: hidden;
  transition: transform 0.24s ease, box-shadow 0.24s ease, filter 0.24s ease;
}
.right-sidebar .widget_search .search-submit::after,
.right-sidebar .widget_block .wp-block-search__button::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, 0.28) 48%, transparent 66%);
  transform: translateX(-135%);
  transition: transform 0.55s ease;
}
.right-sidebar .widget_search .search-submit:hover, .right-sidebar .widget_search .search-submit:focus,
.right-sidebar .widget_block .wp-block-search__button:hover,
.right-sidebar .widget_block .wp-block-search__button:focus {
  outline: none;
  background: #f4d150;
  color: rgb(22, 47, 58);
  transform: translateY(-2px);
  filter: saturate(1.06) brightness(1.03);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.36), 0 24px 36px rgba(227, 190, 49, 0.25);
}
.right-sidebar .widget_search .search-submit:hover::after, .right-sidebar .widget_search .search-submit:focus::after,
.right-sidebar .widget_block .wp-block-search__button:hover::after,
.right-sidebar .widget_block .wp-block-search__button:focus::after {
  transform: translateX(135%);
}
.right-sidebar {
  /* Sidebar nav links */
}
.right-sidebar ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.right-sidebar ul li {
  border-bottom: none;
}
.right-sidebar ul li + li {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.right-sidebar ul li a {
  display: block;
  position: relative;
  padding: 0.95rem 0 0.95rem 1.25rem;
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.02em;
  text-transform: none;
  color: rgba(255, 255, 255, 0.84);
  text-decoration: none;
  background: transparent;
  overflow-wrap: anywhere;
  transition: color 0.18s ease, background 0.18s ease, padding-left 0.25s ease;
}
.right-sidebar ul li a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 0.42rem;
  height: 1px;
  background: rgba(227, 190, 49, 0.55);
  transform: translateY(-50%);
  transition: width 0.25s ease, background 0.25s ease;
}
.right-sidebar ul li a:hover, .right-sidebar ul li a:focus {
  outline: none;
  color: rgb(227, 190, 49);
  padding-left: 1.55rem;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.045), transparent 85%);
}
.right-sidebar ul li a:hover::before, .right-sidebar ul li a:focus::before {
  width: 0.72rem;
  background: rgb(227, 190, 49);
}
.right-sidebar ul li {
  /* Current page — warm amber fill, full-brightness text */
}
.right-sidebar ul li.current-menu-item > a, .right-sidebar ul li.current_page_item > a {
  color: rgb(227, 190, 49);
  font-weight: 600;
}
.right-sidebar ul li.current-menu-item > a::before, .right-sidebar ul li.current_page_item > a::before {
  width: 0.72rem;
  background: rgb(227, 190, 49);
}

/* ==========================================================================
   Service page gallery section (below page layout)
   ========================================================================== */
.portfolio-gallery {
  background: #f7f5f0;
  padding: 3rem 2rem;
}
.portfolio-gallery_header {
  text-align: center;
  margin-bottom: 2rem;
}
.portfolio-gallery_header h3 {
  font-size: clamp(1.4rem, 3vw, 2rem);
  text-transform: uppercase;
  letter-spacing: 2px;
  font-weight: 800;
  color: #0e0e0e;
}
.portfolio-gallery_header h3::after {
  content: "";
  display: block;
  width: 50px;
  height: 3px;
  background: rgb(227, 190, 49);
  margin: 0.5rem auto 0;
  border-radius: 2px;
}

/* ==========================================================================
   Responsive — collapse to single column below 1100px
   ========================================================================== */
@media (max-width: 1100px) {
  .page-layout {
    grid-template-columns: 1fr;
    gap: 1.5rem;
    padding: 2rem var(--layout-gutter) 3rem;
  }
  .page-layout .sidebar,
  .page-layout .right-sidebar {
    display: flex;
    grid-column: 1;
    position: static;
    top: auto;
    max-height: none;
    overflow: visible;
    margin-top: 1rem;
  }
}
@media (max-width: 768px) {
  .page-wrapper {
    padding: 2rem 0 0;
  }
}
@media (max-width: 640px) {
  .page-layout {
    padding: 0 var(--layout-gutter) 2.5rem;
  }
  .page-layout > .site-main {
    padding: 0;
  }
  .right-sidebar > * {
    padding: 1.2rem 1.1rem 1.3rem 1.35rem;
  }
  .right-sidebar .widget-title,
  .right-sidebar h2,
  .right-sidebar h3 {
    gap: 0.55rem;
    font-size: 0.96rem;
    letter-spacing: 0.14em;
  }
  .right-sidebar .widget-title::after,
  .right-sidebar h2::after,
  .right-sidebar h3::after {
    min-width: 2rem;
  }
  .right-sidebar ul li a {
    font-size: 0.82rem;
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
  }
}
@media (max-width: 520px) {
  .right-sidebar .widget_search .search-form,
  .right-sidebar .widget_block .wp-block-search__inside-wrapper {
    grid-template-columns: 1fr;
  }
  .right-sidebar .widget_search .search-submit,
  .right-sidebar .widget_block .wp-block-search__button {
    width: 100%;
  }
  .right-sidebar .widget_search,
  .right-sidebar .widget_block .wp-block-search {
    margin-inline: 0;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Archive / Blog / Search / Services Wrapper
   ========================================================================== */
.archive-wrapper {
  position: relative;
  background: radial-gradient(circle at top right, rgba(227, 190, 49, 0.1), transparent 26%), linear-gradient(180deg, #f7f3e8 0%, #f7f4ee 18%, #ffffff 55%);
  padding: 4rem 0 6rem;
  /* Services variant — slightly warmer dark */
}
.archive-wrapper--services {
  background: radial-gradient(circle at top left, rgba(227, 190, 49, 0.12), transparent 24%), radial-gradient(circle at bottom right, rgba(227, 190, 49, 0.08), transparent 22%), linear-gradient(180deg, #12222a 0%, #0f1b21 52%, #0d161b 100%);
}

.blog-container {
  max-width: var(--layout-shell-max);
  margin: 0 auto;
  padding: 0 var(--layout-gutter);
}

/* ==========================================================================
   Archive / Section Header
   ========================================================================== */
.archive-header {
  margin-bottom: 2.8rem;
  padding: 0 0.1rem 2.2rem;
  border-bottom: 1px solid rgba(37, 37, 37, 0.08);
}
.archive-header__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  font-size: 0.66rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: rgb(227, 190, 49);
  margin-bottom: 0.9rem;
}
.archive-header__eyebrow::after {
  content: "";
  width: 3rem;
  height: 1px;
  background: linear-gradient(90deg, rgba(227, 190, 49, 0.85), rgba(227, 190, 49, 0));
}
.archive-header__title {
  max-width: 14ch;
  font-size: clamp(2rem, 4.6vw, 3.5rem);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: #0e0e0e;
  margin: 0 0 0.9rem;
  line-height: 1;
}
.archive-header__title span {
  color: rgb(227, 190, 49);
}
.archive-header__desc {
  font-size: clamp(0.98rem, 1vw + 0.7rem, 1.1rem);
  color: rgba(37, 37, 37, 0.62);
  max-width: 58ch;
  margin: 0;
  line-height: 1.8;
}
.archive-header__desc:empty {
  display: none;
}

.archive-header--journal {
  max-width: 760px;
}

.archive-wrapper--journal {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0) 28%), radial-gradient(circle at top left, rgba(22, 47, 58, 0.07), transparent 18%), linear-gradient(180deg, #f2eee4 0%, #f8f5ef 38%, #fcfbf7 100%);
}
.archive-wrapper--journal::after {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 260px;
  pointer-events: none;
  opacity: 0.16;
  background: repeating-linear-gradient(90deg, rgba(22, 47, 58, 0.07) 0 1px, transparent 1px 11rem);
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.32), transparent 86%);
}

.archive-header--journal {
  max-width: 840px;
  padding-bottom: 2rem;
  border-bottom-color: rgba(22, 47, 58, 0.12);
}
.archive-header--journal .archive-header__eyebrow {
  color: rgba(22, 47, 58, 0.7);
}
.archive-header--journal .archive-header__eyebrow::after {
  background: linear-gradient(90deg, rgba(22, 47, 58, 0.42), rgba(22, 47, 58, 0));
}
.archive-header--journal .archive-header__title {
  max-width: 12ch;
  text-wrap: balance;
}
.archive-header--journal .archive-header__desc {
  max-width: 62ch;
  color: rgba(37, 37, 37, 0.66);
  text-wrap: pretty;
}

.archive-header--services {
  max-width: 860px;
  padding: 0 0.1rem 2.4rem;
  border-bottom-color: rgba(255, 255, 255, 0.08);
}
.archive-header--services .archive-header__eyebrow {
  color: rgba(227, 190, 49, 0.92);
}
.archive-header--services .archive-header__title {
  color: #fff;
  max-width: 10ch;
}
.archive-header--services .archive-header__desc {
  color: rgba(255, 255, 255, 0.64);
  max-width: 60ch;
}

/* ==========================================================================
   Post Grid — auto-fit CSS Grid
   ========================================================================== */
.post-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: 1.5rem;
  align-items: stretch;
}
.post-grid > * {
  min-width: 0;
}
.post-grid {
  /* Services cards: fewer, wider */
}
.post-grid--services {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
  gap: 1.75rem;
}

/* ==========================================================================
   Post Card — blog / archive / search
   ========================================================================== */
.post-card {
  position: relative;
  min-width: 0;
  background: rgba(255, 255, 255, 0.88);
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(37, 37, 37, 0.08);
  display: flex;
  flex-direction: column;
  box-shadow: 0 18px 42px rgba(26, 26, 26, 0.06);
  transition: transform 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease;
}
.post-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 2px;
  background: linear-gradient(180deg, rgba(227, 190, 49, 0.95), rgba(227, 190, 49, 0.12));
  opacity: 0;
  transition: opacity 0.28s ease;
  z-index: 2;
}
.post-card__link {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-width: 0;
  text-decoration: none;
  color: inherit;
}
.post-card {
  /* Thumbnail — fixed 16:9 aspect ratio, image covers */
}
.post-card__thumb {
  position: relative;
  aspect-ratio: 16/9;
  overflow: hidden;
  padding: 1rem 1rem 0;
}
.post-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  border-radius: 8px;
  transition: transform 0.5s ease;
}
.post-card {
  /* WordPress default post thumbnail (outside .post-card__thumb) */
}
.post-card > a > img,
.post-card > a > .wp-post-image {
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}
.post-card {
  /* Text area */
}
.post-card-text {
  padding: 1.2rem 1.15rem 1.2rem;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  min-width: 0;
  gap: 0.7rem;
}
.post-card__category {
  font-size: 0.64rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: rgb(227, 190, 49);
}
.post-card__title {
  font-size: clamp(1rem, 0.9vw + 0.8rem, 1.2rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  line-height: 1.25;
  margin: 0;
  color: #0e0e0e;
  overflow-wrap: anywhere;
}
.post-card__excerpt {
  font-size: 0.92rem;
  line-height: 1.72;
  color: rgba(37, 37, 37, 0.62);
  margin: 0;
  flex-grow: 1;
  overflow-wrap: anywhere;
}
.post-card {
  /* Date + Read more row */
}
.post-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-top: 0.65rem;
  padding-top: 0.9rem;
  border-top: 1px solid rgba(37, 37, 37, 0.08);
}
.post-card__date {
  font-size: 0.66rem;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: rgba(37, 37, 37, 0.42);
  min-width: 0;
}
.post-card__arrow {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.66rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: rgb(22, 47, 58);
  min-width: 0;
  max-width: 100%;
  transition: gap 0.22s ease, color 0.22s ease;
}
.post-card__arrow i {
  font-size: 0.6rem;
  transition: transform 0.22s ease;
}
.post-card {
  /* Hover */
}
.post-card:hover {
  transform: translateY(-4px);
  border-color: rgba(227, 190, 49, 0.42);
  box-shadow: 0 24px 48px rgba(26, 26, 26, 0.1);
}
.post-card:hover::before {
  opacity: 1;
}
.post-card:hover .post-card__thumb img,
.post-card:hover > a > img {
  transform: scale(1.04);
}
.post-card:hover .post-card__arrow {
  gap: 0.65rem;
  color: rgb(227, 190, 49);
}
.post-card:hover .post-card__arrow i {
  transform: translateX(2px);
}
.post-card {
  /* Service card variant — image-dominant with overlay title */
}
.post-card--service {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 24px 54px rgba(0, 0, 0, 0.26);
  backdrop-filter: blur(10px);
}
.post-card--service::before {
  opacity: 1;
  background: linear-gradient(180deg, rgb(227, 190, 49), rgba(227, 190, 49, 0.2));
}
.post-card--service .post-card__thumb {
  aspect-ratio: 4/3;
  padding: 1rem 1rem 0;
}
.post-card--service .post-card__thumb::after {
  content: "";
  position: absolute;
  inset: 1rem 1rem 0;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(8, 14, 17, 0.02) 0%, rgba(8, 14, 17, 0.28) 60%, rgba(8, 14, 17, 0.62) 100%);
  pointer-events: none;
}
.post-card--service .post-card__thumb img {
  min-height: 100%;
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.28);
}
.post-card--service .post-card-text {
  position: relative;
  gap: 0.8rem;
  padding: 1.2rem 1.2rem 1.25rem;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01));
}
.post-card--service .post-card__category {
  color: rgba(227, 190, 49, 0.92);
}
.post-card--service .post-card__title {
  font-size: clamp(1.2rem, 1.1vw + 1rem, 1.5rem);
  margin: 0;
  color: #fff;
  line-height: 1.12;
}
.post-card--service .post-card__excerpt {
  color: rgba(255, 255, 255, 0.66);
  font-size: 0.94rem;
  line-height: 1.75;
}
.post-card--service .post-card__footer {
  margin-top: auto;
  padding-top: 1rem;
  border-top-color: rgba(255, 255, 255, 0.08);
}
.post-card--service .post-card__date {
  color: rgba(255, 255, 255, 0.4);
}
.post-card--service .post-card__arrow {
  color: rgba(227, 190, 49, 0.95);
  white-space: nowrap;
}
.post-card--service:hover {
  border-color: rgba(227, 190, 49, 0.42);
  box-shadow: 0 30px 64px rgba(0, 0, 0, 0.34);
}
.post-card--service:hover .post-card__thumb img {
  transform: scale(1.045);
}
.post-card--service:hover .post-card__thumb::after {
  background: linear-gradient(180deg, rgba(8, 14, 17, 0.01) 0%, rgba(8, 14, 17, 0.2) 56%, rgba(8, 14, 17, 0.54) 100%);
}

.post-card--journal {
  content-visibility: auto;
  contain-intrinsic-size: 430px;
  container-type: inline-size;
  border-radius: 2px;
  border-color: rgba(22, 47, 58, 0.12);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 245, 238, 0.9));
  box-shadow: none;
  overflow: clip;
}
.post-card--journal::before {
  inset: 0 1rem auto 1rem;
  width: auto;
  height: 1px;
  opacity: 0.9;
  background: linear-gradient(90deg, rgba(22, 47, 58, 0.16), rgba(227, 190, 49, 0.5), rgba(22, 47, 58, 0));
}
.post-card--journal .post-card__link {
  min-height: 100%;
  isolation: isolate;
}
.post-card--journal .post-card__thumb {
  padding: 0.9rem 0.9rem 0;
}
.post-card--journal .post-card__thumb::after {
  content: "";
  position: absolute;
  inset: 0.9rem 0.9rem 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(22, 47, 58, 0.08));
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.28s ease;
}
.post-card--journal .post-card__thumb img {
  border-radius: 2px;
  border: 1px solid rgba(22, 47, 58, 0.08);
}
.post-card--journal .post-card-text {
  gap: 0.65rem;
  padding: 1rem 1rem 1.05rem;
}
.post-card--journal .post-card__category {
  color: rgba(22, 47, 58, 0.56);
}
.post-card--journal .post-card__title {
  max-width: 16ch;
  text-wrap: balance;
}
.post-card--journal .post-card__excerpt {
  color: rgba(37, 37, 37, 0.66);
  text-wrap: pretty;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: clip;
}
.post-card--journal .post-card__footer {
  border-top-color: rgba(22, 47, 58, 0.1);
}
.post-card--journal .post-card__date {
  color: rgba(22, 47, 58, 0.44);
}
.post-card--journal .post-card__arrow {
  gap: 0.42rem;
  color: rgba(22, 47, 58, 0.74);
}
.post-card--journal:hover, .post-card--journal:focus-within {
  transform: translateY(-2px);
  border-color: rgba(22, 47, 58, 0.24);
  box-shadow: none;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 241, 232, 0.94));
}
.post-card--journal:hover .post-card__thumb img, .post-card--journal:focus-within .post-card__thumb img {
  transform: scale(1.03);
}
.post-card--journal:hover .post-card__thumb::after, .post-card--journal:focus-within .post-card__thumb::after {
  opacity: 1;
}
.post-card--journal:hover .post-card__arrow, .post-card--journal:focus-within .post-card__arrow {
  gap: 0.58rem;
  color: rgb(227, 190, 49);
}

@supports selector(.post-card--journal:has(.post-card__link:focus-visible)) {
  .post-card--journal:has(.post-card__link:focus-visible) {
    border-color: rgba(227, 190, 49, 0.56);
  }
}
.archive-wrapper--journal .archive-pagination .page-numbers {
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.8);
}

.archive-wrapper--journal .archive-pagination .page-numbers.current {
  background: rgba(22, 47, 58, 0.95);
  border-color: rgba(22, 47, 58, 0.95);
  color: #fff;
}

@container (max-width: 360px) {
  .post-card--journal .post-card__title {
    max-width: none;
  }
  .post-card--journal .post-card__footer {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.45rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  .post-card--journal,
  .post-card--journal * {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
/* ==========================================================================
   Archive Pagination
   ========================================================================== */
.archive-pagination {
  margin-top: 3.5rem;
  text-align: center;
}
.archive-pagination .nav-links {
  display: flex;
  justify-content: center;
  gap: 0.4rem;
  flex-wrap: wrap;
}
.archive-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 0.5rem;
  border: 1px solid rgba(37, 37, 37, 0.1);
  color: rgba(37, 37, 37, 0.62);
  background: rgba(255, 255, 255, 0.86);
  text-decoration: none;
  font-size: 0.8rem;
  font-weight: 600;
  border-radius: 6px;
  transition: border-color 0.22s ease, color 0.22s ease, background 0.22s ease;
}
.archive-pagination .page-numbers.current {
  border-color: rgb(227, 190, 49);
  background: rgb(227, 190, 49);
  color: #0e0e0e;
}
.archive-pagination .page-numbers:hover:not(.dots):not(.current) {
  border-color: rgb(227, 190, 49);
  color: rgb(227, 190, 49);
}
.archive-pagination .page-numbers.dots {
  border-color: transparent;
  cursor: default;
}

@media (max-width: 768px) {
  .archive-wrapper {
    padding: 3rem 0 4rem;
  }
  .archive-wrapper--journal::after {
    height: 180px;
    opacity: 0.12;
  }
  .blog-container {
    padding: 0 var(--layout-gutter);
  }
  .archive-header {
    margin-bottom: 2.2rem;
    padding-bottom: 1.8rem;
  }
  .archive-header__title {
    max-width: none;
  }
  .post-grid {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }
  .post-card__thumb {
    padding: 0.85rem 0.85rem 0;
  }
  .post-card--journal .post-card__thumb::after {
    inset: 0.85rem 0.85rem 0;
  }
  .post-card-text {
    padding: 1.05rem 1rem 1.1rem;
  }
  .post-card--journal .post-card__title {
    max-width: none;
  }
  .post-card--journal .post-card__footer {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.45rem;
  }
}
/* ==========================================================================
   Search form in search results / no results
   ========================================================================== */
.search-form-wrap {
  max-width: 540px;
  margin: 2rem auto 0;
}
.search-form-wrap .search-field {
  width: 100%;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 0;
  color: #fff;
  padding: 0.85rem 1.2rem;
  font-size: 0.95rem;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
}
.search-form-wrap .search-field::placeholder {
  color: rgba(255, 255, 255, 0.35);
}
.search-form-wrap .search-field:focus {
  outline: none;
  border-color: rgb(227, 190, 49);
}
.search-form-wrap .search-submit {
  background: rgb(227, 190, 49);
  border: 2px solid rgb(227, 190, 49);
  color: #0e0e0e;
  padding: 0.85rem 1.5rem;
  font-weight: 700;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-radius: 0;
  cursor: pointer;
  transition: background 0.22s ease, color 0.22s ease;
}
.search-form-wrap .search-submit:hover {
  background: transparent;
  color: rgb(227, 190, 49);
}

.no-posts {
  color: rgba(255, 255, 255, 0.45);
  text-align: center;
  font-style: italic;
  padding: 3rem 0;
}

.archive-wrapper--services .no-posts {
  color: rgba(255, 255, 255, 0.58);
}

.page-template-services .archive-header__title,
.page-template-services .archive-header__desc {
  color: #fdfdfd !important;
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 768px) {
  .archive-wrapper {
    padding: 2.5rem 0 4rem;
  }
  .blog-container {
    padding: 0 var(--layout-gutter);
  }
  .post-grid {
    grid-template-columns: 1fr;
  }
  .post-grid--services {
    grid-template-columns: 1fr;
  }
  .archive-header--services .archive-header__title {
    max-width: none;
  }
  .post-card--service .post-card__thumb {
    padding: 0.85rem 0.85rem 0;
  }
  .post-card--service .post-card__thumb::after {
    inset: 0.85rem 0.85rem 0;
  }
  .post-card--service .post-card-text {
    padding: 1.05rem 1rem 1.1rem;
  }
}
/* ==========================================================================
   Journal filters — shared between the archive toolbar and the single-post
   sidebar variant. Tabs switch which chip panel is visible; chips are links.
   ========================================================================== */
.journal-filters {
  --jf-ink: #1a2a32;
  --jf-ink-soft: rgba(26, 42, 50, 0.7);
  --jf-ink-mute: rgba(26, 42, 50, 0.5);
  --jf-rule: rgba(22, 47, 58, 0.1);
  --jf-surface: rgba(255, 255, 255, 0.78);
  display: grid;
  gap: 1.1rem;
  margin-bottom: clamp(1.8rem, 3vw, 2.75rem);
  padding: clamp(1rem, 2vw, 1.4rem);
  border: 1px solid var(--jf-rule);
  border-radius: 4px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.72) 0%, rgba(249, 246, 238, 0.6) 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.6) inset;
}

.journal-filter-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--jf-rule);
}

.journal-filter-tab {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.65rem 1rem;
  border: 1px solid;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  cursor: pointer;
  transition: border-color 0.22s ease, background 0.22s ease, color 0.22s ease, transform 0.22s ease;
  border-color: var(--jf-rule);
  background: rgba(255, 255, 255, 0.72);
  color: var(--jf-ink-soft);
}
.journal-filter-tab:hover, .journal-filter-tab:focus-visible {
  outline: none;
  border-color: rgba(227, 190, 49, 0.55);
  background: #fff;
  color: #0e0e0e;
}
.journal-filter-tab.is-active {
  border-color: transparent;
  background: rgb(227, 190, 49);
  color: #0e0e0e;
}

.journal-filter-panel[hidden] {
  display: none;
}

.journal-filter-group__links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.journal-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem 0.9rem;
  border: 1px solid;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.01em;
  text-decoration: none;
  transition: border-color 0.22s ease, background 0.22s ease, color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
  border-color: var(--jf-rule);
  background: #fff;
  color: #0e0e0e;
}
.journal-filter-chip__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.35rem;
  padding: 0.15rem 0.4rem;
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--jf-ink-mute);
  background: rgba(22, 47, 58, 0.06);
  border-radius: 999px;
}
.journal-filter-chip:hover, .journal-filter-chip:focus-visible {
  border-color: rgba(227, 190, 49, 0.55);
  background: rgba(227, 190, 49, 0.08);
  color: rgb(22, 47, 58);
  transform: translateY(-1px);
  box-shadow: 0 8px 18px -12px rgba(12, 22, 28, 0.35);
}
.journal-filter-chip:hover .journal-filter-chip__count, .journal-filter-chip:focus-visible .journal-filter-chip__count {
  background: rgba(227, 190, 49, 0.22);
  color: rgb(22, 47, 58);
}
.journal-filter-chip.is-active {
  border-color: transparent;
  background: rgb(227, 190, 49);
  color: #0e0e0e;
}
.journal-filter-chip.is-active .journal-filter-chip__count {
  background: rgba(22, 47, 58, 0.18);
  color: #0e0e0e;
}

/* ==========================================================================
   Sidebar variant — dark background inherited from single-post sidebar
   ========================================================================== */
.single-post-sidebar__panel--filters {
  padding: 0;
}

.single-post-sidebar__panel--filters .journal-filters {
  --jf-rule: rgba(255, 255, 255, 0.08);
  margin: 0;
  padding: 1.45rem 1.45rem 1.55rem 1.85rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  gap: 1rem;
}

.journal-filters--sidebar .journal-filters__header {
  display: grid;
  gap: 0.4rem;
  margin-bottom: 0.3rem;
}
.journal-filters--sidebar .journal-filters__eyebrow {
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgb(227, 190, 49);
}
.journal-filters--sidebar .journal-filters__title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: #fff;
}
.journal-filters--sidebar .journal-filter-tabs {
  gap: 0.35rem;
  padding-bottom: 0.75rem;
  border-bottom-color: rgba(255, 255, 255, 0.08);
}
.journal-filters--sidebar .journal-filter-tab {
  padding: 0.5rem 0.75rem;
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.6rem;
  letter-spacing: 0.18em;
}
.journal-filters--sidebar .journal-filter-tab:hover, .journal-filters--sidebar .journal-filter-tab:focus-visible {
  border-color: rgba(227, 190, 49, 0.52);
  background: rgba(227, 190, 49, 0.12);
  color: #fff;
}
.journal-filters--sidebar .journal-filter-tab.is-active {
  background: rgb(227, 190, 49);
  color: #0e0e0e;
}
.journal-filters--sidebar .journal-filter-chip {
  padding: 0.42rem 0.68rem;
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.72rem;
}
.journal-filters--sidebar .journal-filter-chip__count {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.58);
}
.journal-filters--sidebar .journal-filter-chip:hover, .journal-filters--sidebar .journal-filter-chip:focus-visible {
  border-color: rgba(227, 190, 49, 0.55);
  background: rgba(227, 190, 49, 0.14);
  color: #fff;
}
.journal-filters--sidebar .journal-filter-chip:hover .journal-filter-chip__count, .journal-filters--sidebar .journal-filter-chip:focus-visible .journal-filter-chip__count {
  background: rgba(227, 190, 49, 0.22);
  color: #fff;
}
.journal-filters--sidebar .journal-filter-chip.is-active {
  background: rgb(227, 190, 49);
  color: #0e0e0e;
}
.journal-filters--sidebar .journal-filter-chip.is-active .journal-filter-chip__count {
  background: rgba(22, 47, 58, 0.2);
  color: #0e0e0e;
}

@media (max-width: 640px) {
  .journal-filters {
    padding: 0.9rem;
  }
  .journal-filter-tab {
    padding: 0.55rem 0.8rem;
    font-size: 0.66rem;
  }
}
/* ==========================================================================
   Single post — reading progress bar
   ========================================================================== */
.single-post-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: rgba(22, 47, 58, 0.06);
  z-index: 9999;
  pointer-events: none;
}

.single-post-progress__bar {
  display: block;
  height: 100%;
  width: 100%;
  transform-origin: 0 50%;
  transform: scaleX(0);
  background: linear-gradient(90deg, rgb(227, 190, 49) 0%, #f4d150 60%, rgb(227, 190, 49) 100%);
  box-shadow: 0 0 12px rgba(227, 190, 49, 0.45);
  will-change: transform;
  transition: transform 0.08s linear;
}

/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Landing Page Sections
   Used by: page-templates/landing.php + modular section template-parts
   ========================================================================== */
/* --------------------------------------------------------------------------
   Section — base (shared across all landing sections)
   -------------------------------------------------------------------------- */
.section {
  padding: 5rem 0;
}
.section__inner {
  max-width: var(--layout-shell-max);
  margin: 0 auto;
  padding: 0 var(--layout-gutter);
}
.section__header {
  text-align: center;
  margin-bottom: 3.5rem;
}
.section__eyebrow {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: rgb(227, 190, 49);
  margin-bottom: 0.75rem;
  position: relative;
  padding: 0 1.5rem;
}
.section__eyebrow::before, .section__eyebrow::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 30px;
  height: 1px;
  background: rgb(227, 190, 49);
  opacity: 0.6;
}
.section__eyebrow::before {
  right: 100%;
  margin-right: -1.4rem;
}
.section__eyebrow::after {
  left: 100%;
  margin-left: -1.4rem;
}
.section__title {
  font-size: clamp(1.8rem, 3.5vw, 2.8rem);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #0e0e0e;
  margin: 0 0 1rem;
  line-height: 1.1;
}
.section__intro {
  font-size: clamp(0.95rem, 1.5vw, 1.1rem);
  color: #666;
  max-width: 560px;
  margin: 0 auto;
  line-height: 1.7;
}
.section__cta {
  text-align: center;
  margin-top: 3rem;
}

/* Landing page WP content intro area */
.landing-intro {
  max-width: var(--layout-content-max);
  margin: 0 auto;
  padding: 4rem var(--layout-gutter);
  text-align: center;
}
.landing-intro .entry-content {
  font-size: clamp(1rem, 1.6vw, 1.15rem);
  line-height: 1.75;
  color: #444;
  max-width: 760px;
  margin: 0 auto;
}
.landing-intro .entry-content p {
  column-count: 1;
}
.landing-intro .entry-content { /* override .two-col on landing */ }

@media (max-width: 768px) {
  .section {
    padding: 4rem 0;
  }
  .section__inner {
    padding: 0 var(--layout-gutter);
  }
  .section__header {
    margin-bottom: 2.75rem;
  }
  .landing-intro {
    padding: 3rem var(--layout-gutter);
  }
}
/* --------------------------------------------------------------------------
   Services Grid Section
   -------------------------------------------------------------------------- */
.section--services {
  background: #f9f7f3; /* warm off-white — evokes paper/natural materials */
  position: relative;
  /* Subtle amber top border */
}
.section--services::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 4px;
  background: rgb(227, 190, 49);
  border-radius: 0 0 4px 4px;
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}
@media (max-width: 900px) {
  .services-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 560px) {
  .services-grid {
    grid-template-columns: 1fr;
  }
}

.service-card {
  background: #fff;
  padding: 2.5rem 2rem;
  border-radius: 0;
  border-bottom: 3px solid transparent;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.07);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  transition: transform 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease;
}
.service-card:hover {
  transform: translateY(-5px);
  border-color: rgb(227, 190, 49);
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.12);
}
.service-card__icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(227, 190, 49, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.service-card__icon i {
  font-size: 1.3rem;
  color: rgb(227, 190, 49);
}
.service-card__title {
  font-size: clamp(1rem, 1.5vw, 1.15rem);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #0e0e0e;
  margin: 0;
  line-height: 1.2;
}
.service-card__text {
  font-size: 0.9rem;
  color: #666;
  line-height: 1.65;
  margin: 0;
  flex-grow: 1;
}

@media (max-width: 560px) {
  .section {
    padding: 3.25rem 0;
  }
  .section__inner {
    padding: 0 var(--layout-gutter);
  }
  .service-card {
    padding: 2rem 1.35rem;
  }
}
/* --------------------------------------------------------------------------
   Heritage Banner Section (2-column: image | content)
   -------------------------------------------------------------------------- */
.section--heritage {
  background: rgb(22, 47, 58);
  padding: 0; /* grid handles spacing */
  overflow: hidden;
}

.heritage-banner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 520px;
}
.heritage-banner__image {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  /* Warm overlay on the image */
}
.heritage-banner__image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(22, 47, 58, 0.3) 0%, transparent 100%);
}
.heritage-banner__content {
  padding: 5rem 4rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1.25rem;
  color: #e8e8e8;
}
.heritage-banner__content .section__eyebrow {
  color: rgb(227, 190, 49);
  align-self: anchor-center;
}
.heritage-banner__content .section__title {
  color: #fff;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
}
.heritage-banner__header {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  gap: 0.9rem;
}
.heritage-banner__flag {
  position: relative;
  display: inline-block;
  width: 3.5rem;
  height: 2.35rem;
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 0.2rem;
  background: #000;
  box-shadow: 0 0.55rem 1.5rem rgba(0, 0, 0, 0.24);
  overflow: hidden;
}
.heritage-banner__flag-cross {
  position: absolute;
  display: block;
  background: #fff;
}
.heritage-banner__flag-cross--vertical {
  top: 0;
  bottom: 0;
  left: 50%;
  width: 0.42rem;
  transform: translateX(-50%);
}
.heritage-banner__flag-cross--horizontal {
  top: 50%;
  left: 0;
  right: 0;
  height: 0.42rem;
  transform: translateY(-50%);
}
.heritage-banner__text {
  font-size: 0.95rem;
  line-height: 1.75;
  color: rgba(255, 255, 255, 0.75);
}
.heritage-banner__text p {
  margin: 0 0 0.75rem;
  column-count: 1; /* prevent two-col inheritance */
}
.heritage-banner__text p:last-child {
  margin: 0;
}
@media (max-width: 900px) {
  .heritage-banner {
    grid-template-columns: 1fr;
  }
  .heritage-banner__image {
    min-height: 260px;
  }
  .heritage-banner__content {
    padding: 3rem 2rem;
  }
  .heritage-banner__header {
    justify-content: center;
  }
  .heritage-banner__flag {
    width: 3rem;
    height: 2rem;
  }
  .heritage-banner .btn {
    margin: 1rem auto;
  }
}
@media (max-width: 560px) {
  .heritage-banner__content {
    padding: 2.4rem 1.25rem;
  }
}

/* --------------------------------------------------------------------------
   Portfolio Preview Section (masonry-style grid)
   -------------------------------------------------------------------------- */
.section--portfolio {
  background: #0e0e0e;
}
.section--portfolio .section__title,
.section--portfolio .section__intro {
  color: #fff;
}
.section--portfolio .section__intro {
  color: rgba(255, 255, 255, 0.6);
}

.portfolio-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 280px;
  gap: 1rem;
  /* Let the 4th item span 2 columns for visual variety */
}
.portfolio-grid .portfolio-card:nth-child(4) {
  grid-column: span 2;
}
@media (max-width: 900px) {
  .portfolio-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .portfolio-grid .portfolio-card:nth-child(4) {
    grid-column: span 1;
  }
}
@media (max-width: 560px) {
  .portfolio-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: 220px;
  }
  .portfolio-grid .portfolio-card:nth-child(4) {
    grid-column: span 1;
  }
}

.portfolio-card {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 0;
  text-decoration: none;
}
.portfolio-card__image {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 0.5s ease;
}
.portfolio-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(20, 12, 2, 0.82) 0%, rgba(20, 12, 2, 0.2) 55%, transparent 100%);
  display: flex;
  align-items: flex-end;
  padding: 1.5rem;
  opacity: 0;
  transition: opacity 0.35s ease;
}
.portfolio-card__title {
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #fff;
  margin: 0;
  transform: translateY(8px);
  transition: transform 0.35s ease;
}
.portfolio-card:hover .portfolio-card__image {
  transform: scale(1.06);
}
.portfolio-card:hover .portfolio-card__overlay {
  opacity: 1;
}
.portfolio-card:hover .portfolio-card__title {
  transform: translateY(0);
}

.portfolio-empty {
  grid-column: 1/-1;
  text-align: center;
  color: rgba(255, 255, 255, 0.5);
  font-style: italic;
  padding: 2rem;
}

/* --------------------------------------------------------------------------
   Craft Pillars Section
   Four values in a near-black grid with Roman numeral decorations
   -------------------------------------------------------------------------- */
.section--pillars {
  background: #141414;
  padding: 5rem 0;
}
.section--pillars .section__eyebrow {
  color: rgba(227, 190, 49, 0.75);
}
.section--pillars .section__eyebrow::before, .section--pillars .section__eyebrow::after {
  background: rgba(227, 190, 49, 0.4);
}
.section--pillars .section__title {
  color: #f0f0f0;
}

.pillars-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  /* thin amber dividers between cards */
  gap: 1px;
  background: rgba(227, 190, 49, 0.12);
  border: 1px solid rgba(227, 190, 49, 0.12);
  border-radius: 6px;
  overflow: hidden;
}
@media (max-width: 900px) {
  .pillars-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 480px) {
  .pillars-grid {
    grid-template-columns: 1fr;
  }
}

.pillar-card {
  background: #141414;
  padding: 3rem 2rem 2.5rem;
  position: relative;
  overflow: hidden;
  transition: background 0.3s ease;
  /* Faint Roman numeral backdrop */
}
.pillar-card__numeral {
  position: absolute;
  top: -0.5rem;
  right: 1rem;
  font-size: clamp(3rem, 2rem + 5vw, 5rem);
  font-weight: 900;
  line-height: 1;
  color: rgba(227, 190, 49, 0.07);
  user-select: none;
  pointer-events: none;
  transition: color 0.3s ease;
}
.pillar-card__icon {
  margin-bottom: 1.25rem;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(227, 190, 49, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s ease;
}
.pillar-card__icon i {
  font-size: 1.1rem;
  color: rgb(227, 190, 49);
}
.pillar-card__title {
  font-size: 0.85rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  color: #fff;
  margin: 0 0 0.5rem;
  /* Amber underline that grows on hover */
}
.pillar-card__title::after {
  content: "";
  display: block;
  width: 28px;
  height: 2px;
  background: rgb(227, 190, 49);
  margin-top: 0.5rem;
  border-radius: 1px;
  transition: width 0.35s ease;
}
.pillar-card__text {
  font-size: 0.88rem;
  line-height: 1.72;
  color: rgba(255, 255, 255, 0.5);
  margin: 0;
  transition: color 0.3s ease;
}
.pillar-card {
  /* Hover state */
}
.pillar-card:hover {
  background: #1c1c1c;
}
.pillar-card:hover .pillar-card__numeral {
  color: rgba(227, 190, 49, 0.14);
}
.pillar-card:hover .pillar-card__icon {
  background: rgba(227, 190, 49, 0.18);
}
.pillar-card:hover .pillar-card__title::after {
  width: 56px;
}
.pillar-card:hover .pillar-card__text {
  color: rgba(255, 255, 255, 0.68);
}

@media (max-width: 560px) {
  .pillar-card {
    padding: 2.25rem 1.25rem 2rem;
  }
}
/* --------------------------------------------------------------------------
   Landing Testimonials Slider
   Full-width dark section, one quote per slide, auto-advancing
   -------------------------------------------------------------------------- */
.section--testimonials-landing {
  background: rgb(22, 47, 58);
  position: relative;
  overflow: hidden;
  /* Giant decorative quotation mark */
}
.section--testimonials-landing::before {
  content: "“";
  position: absolute;
  top: -2rem;
  left: 3%;
  font-size: clamp(9rem, 4rem + 24vw, 22rem);
  line-height: 1;
  font-family: Georgia, "Times New Roman", serif;
  color: rgba(227, 190, 49, 0.055);
  pointer-events: none;
  user-select: none;
}
.section--testimonials-landing .section__title {
  color: #fff;
}
.section--testimonials-landing .section__eyebrow::before, .section--testimonials-landing .section__eyebrow::after {
  background: rgba(227, 190, 49, 0.45);
}

/* The slider wrapper — clips the sliding track */
.testimonials-slider-landing {
  overflow: hidden;
  position: relative;
  max-width: 860px;
  margin: 0 auto;
}

/* Sliding track */
.testimonials-slider-landing .testimonials-track {
  display: flex;
  transition: transform 0.65s cubic-bezier(0.4, 0, 0.2, 1);
}

.testimonials-slider-landing .testimonial-slide {
  min-width: 100%;
  box-sizing: border-box;
  padding: 0 1rem;
}

/* Individual testimonial */
.testimonial-landing {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 2rem;
  margin: 0;
  padding: 0;
  border: none;
}
.testimonial-landing__quote p {
  font-size: clamp(1.05rem, 2.2vw, 1.45rem);
  line-height: 1.75;
  font-weight: 300;
  font-style: italic;
  color: rgba(255, 255, 255, 0.88);
  margin: 0;
  column-count: 1; /* prevent two-col inheritance */
}
.testimonial-landing__author {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.3rem;
  font-style: normal;
  /* Amber separator line above author */
}
.testimonial-landing__author::before {
  content: "";
  display: block;
  width: 40px;
  height: 2px;
  background: rgb(227, 190, 49);
  border-radius: 1px;
  margin-bottom: 0.5rem;
}
.testimonial-landing__name {
  display: block;
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  color: rgb(227, 190, 49);
}
.testimonial-landing__location {
  display: block;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: rgba(255, 255, 255, 0.35);
}

/* Navigation dots (injected by JS) */
.testimonials-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.6rem;
  margin-top: 2.5rem;
}

.testimonials-dot {
  position: relative;
  min-width: 2rem;
  height: 2rem;
  padding: 0 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 999px;
  background: transparent;
  color: rgba(255, 255, 255, 0.65);
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
  overflow: hidden;
}
.testimonials-dot::after {
  content: none;
}
.testimonials-dot__progress {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: rgba(255, 255, 255, 0.75);
  transform: scaleX(0);
  transform-origin: left center;
  opacity: 0;
  pointer-events: none;
}
.testimonials-dot.active {
  background: rgb(227, 190, 49);
  border-color: rgb(227, 190, 49);
  color: #fff;
}
.testimonials-dot.active .testimonials-dot__progress {
  opacity: 1;
}
.testimonials-dot:hover:not(.active) {
  border-color: rgba(255, 255, 255, 0.6);
  color: #fff;
}
.testimonials-dot:focus-visible {
  outline: 2px solid rgb(227, 190, 49);
  outline-offset: 3px;
}

/* Prev / next arrows (injected by JS) */
.testimonials-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: rgba(255, 255, 255, 0.85);
  font-size: 1.6rem;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  z-index: 2;
  transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
}
.testimonials-arrow--prev {
  left: 0.5rem;
}
.testimonials-arrow--next {
  right: 0.5rem;
}
.testimonials-arrow span {
  display: block;
  transform: translateY(-2px);
}
.testimonials-arrow:hover, .testimonials-arrow:focus-visible {
  background: rgb(227, 190, 49);
  border-color: rgb(227, 190, 49);
  color: #0e0e0e;
}
.testimonials-arrow:focus-visible {
  outline: 2px solid rgb(227, 190, 49);
  outline-offset: 3px;
}
.testimonials-arrow:active {
  transform: translateY(-50%) scale(0.94);
}

@media (max-width: 600px) {
  .testimonials-arrow {
    display: none;
  }
}
/* Drag affordance on the track */
.testimonials-slider-landing .testimonials-track,
#testimonialsSlider .testimonials-track {
  cursor: grab;
  user-select: none;
  touch-action: pan-y;
}
.testimonials-slider-landing .testimonials-track:active,
#testimonialsSlider .testimonials-track:active {
  cursor: grabbing;
}

/* Make room for arrows over the slide content */
.testimonials-slider-landing .testimonial-slide {
  padding: 0 3.5rem;
}

@media (max-width: 600px) {
  .testimonials-slider-landing .testimonial-slide {
    padding: 0 1rem;
  }
}
/* Reduced motion: kill transitions everywhere on the slider */
@media (prefers-reduced-motion: reduce) {
  .testimonials-track,
  .testimonials-dot,
  .testimonials-dot__progress,
  .testimonials-arrow {
    transition: none !important;
    animation: none !important;
  }
}
/* --------------------------------------------------------------------------
   Reveal-on-scroll utility
   Paired with src/js/reveal-on-scroll.js — IO adds .is-revealed when visible.
   -------------------------------------------------------------------------- */
.reveal-on-scroll {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}
.reveal-on-scroll.is-revealed {
  opacity: 1;
  transform: translateY(0);
}

/* Staggered delay for grids */
.services-grid .reveal-on-scroll:nth-child(1),
.pillars-grid .reveal-on-scroll:nth-child(1),
.portfolio-grid .reveal-on-scroll:nth-child(1),
.post-grid .reveal-on-scroll:nth-child(1) {
  transition-delay: 0s;
}
.services-grid .reveal-on-scroll:nth-child(2),
.pillars-grid .reveal-on-scroll:nth-child(2),
.portfolio-grid .reveal-on-scroll:nth-child(2),
.post-grid .reveal-on-scroll:nth-child(2) {
  transition-delay: 0.08s;
}
.services-grid .reveal-on-scroll:nth-child(3),
.pillars-grid .reveal-on-scroll:nth-child(3),
.portfolio-grid .reveal-on-scroll:nth-child(3),
.post-grid .reveal-on-scroll:nth-child(3) {
  transition-delay: 0.16s;
}
.services-grid .reveal-on-scroll:nth-child(4),
.pillars-grid .reveal-on-scroll:nth-child(4),
.portfolio-grid .reveal-on-scroll:nth-child(4),
.post-grid .reveal-on-scroll:nth-child(4) {
  transition-delay: 0.24s;
}
.services-grid .reveal-on-scroll:nth-child(5),
.pillars-grid .reveal-on-scroll:nth-child(5),
.portfolio-grid .reveal-on-scroll:nth-child(5),
.post-grid .reveal-on-scroll:nth-child(5) {
  transition-delay: 0.32s;
}
.services-grid .reveal-on-scroll:nth-child(6),
.pillars-grid .reveal-on-scroll:nth-child(6),
.portfolio-grid .reveal-on-scroll:nth-child(6),
.post-grid .reveal-on-scroll:nth-child(6) {
  transition-delay: 0.4s;
}
.services-grid .reveal-on-scroll:nth-child(7),
.pillars-grid .reveal-on-scroll:nth-child(7),
.portfolio-grid .reveal-on-scroll:nth-child(7),
.post-grid .reveal-on-scroll:nth-child(7) {
  transition-delay: 0.48s;
}
.services-grid .reveal-on-scroll:nth-child(8),
.pillars-grid .reveal-on-scroll:nth-child(8),
.portfolio-grid .reveal-on-scroll:nth-child(8),
.post-grid .reveal-on-scroll:nth-child(8) {
  transition-delay: 0.56s;
}

@media (prefers-reduced-motion: reduce) {
  .reveal-on-scroll {
    opacity: 1;
    transform: none;
    transition: none;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
.site-footer {
  background-color: #0e0e0e;
  color: #fff;
  border-top: 4px solid #1e1e1e;
}
.site-footer__logo {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.35rem 0.75rem 1.15rem;
}
.site-footer__logo_title {
  color: rgba(255, 255, 255, 0.38);
  margin: 0 0.6rem;
  font-weight: 300;
  letter-spacing: 0.18em;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35);
  transition: color 0.55s ease, letter-spacing 0.55s ease;
}
.site-footer__logo img,
.site-footer__logo .custom-logo {
  height: 5.99165rem;
  max-width: clamp(6.783rem, 12.4355vw, 10.457125rem);
  opacity: 0.42;
  filter: grayscale(0.35) brightness(0.82) contrast(0.95);
  transition: opacity 0.55s ease, filter 0.55s ease;
}
.site-footer__logo:hover .site-footer__logo_title {
  color: rgba(227, 190, 49, 0.62);
  letter-spacing: 0.21em;
}
.site-footer__logo:hover img,
.site-footer__logo:hover .custom-logo {
  opacity: 0.72;
  filter: grayscale(0) brightness(1) contrast(1);
}
.site-footer h4 {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0 0 1rem 0;
  color: #fff;
  font-size: 1rem;
  font-weight: 800;
  padding-bottom: 0;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  border-bottom: none;
}
.site-footer h4::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: linear-gradient(90deg, rgba(227, 190, 49, 0.75), rgba(227, 190, 49, 0.06));
}
.site-footer__navs {
  position: relative;
  overflow: hidden;
  padding: 1.6rem var(--layout-gutter) 1.8rem;
  padding-inline: var(--layout-edge-padding);
  background: radial-gradient(circle at top right, rgba(227, 190, 49, 0.12), transparent 32%), linear-gradient(180deg, rgba(22, 47, 58, 0.985) 0%, rgba(17, 39, 48, 0.985) 100%);
  text-transform: uppercase;
  display: flex;
  align-items: baseline;
  flex-flow: row wrap;
  justify-content: space-evenly;
  gap: 1.5rem;
}
.site-footer__navs > * {
  position: relative;
  z-index: 1;
  min-width: 220px;
  flex: 1 1 220px;
  padding: 0.35rem 0.5rem;
}
.site-footer__navs .post-date {
  margin-left: 0.5rem;
  opacity: 0.45;
  font-style: italic;
}
.site-footer__navs a {
  font-size: 0.8rem;
}
.site-footer .search-form {
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  transition: border-color 0.3s ease;
  padding-bottom: 2px;
  margin-top: 0.5rem;
}
.site-footer .search-form:focus-within {
  border-bottom-color: rgb(227, 190, 49);
}
.site-footer .search-form label {
  flex: 1;
  margin: 0;
}
.site-footer .search-form .search-field {
  width: 100%;
  background: transparent;
  border: none;
  outline: none;
  color: #d0d0d0;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.5rem 0;
  caret-color: rgb(227, 190, 49);
}
.site-footer .search-form .search-field::placeholder {
  color: rgba(255, 255, 255, 0.3);
  letter-spacing: 0.1em;
}
.site-footer .search-form .search-field::-webkit-search-decoration, .site-footer .search-form .search-field::-webkit-search-cancel-button {
  display: none;
}
.site-footer .search-form .search-submit {
  all: unset;
  cursor: pointer;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0;
}
.site-footer .search-form .search-submit::before {
  content: "\f061";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  font-size: 0.7rem;
  color: rgba(255, 255, 255, 0.35);
  transition: color 0.25s ease, transform 0.25s ease;
}
.site-footer .search-form .search-submit:hover::before {
  color: rgb(227, 190, 49);
  transform: translateX(4px);
}
.site-footer .animated-list ul li a {
  display: block;
  position: relative;
  color: rgba(255, 255, 255, 0.76);
  padding: 0.7rem 0 0.7rem 1.6rem;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  transition: color 0.28s ease, padding-left 0.28s ease, background 0.28s ease;
  will-change: padding-left;
}
.site-footer .animated-list ul li a::before {
  content: "\f054";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  font-size: 0.7rem;
  color: rgb(227, 190, 49);
  position: absolute;
  left: 0.15rem;
  top: 50%;
  transform: translateY(-50%) translateX(0) rotate(0deg);
  opacity: 0.85;
  transition: transform 0.32s cubic-bezier(0.65, 0, 0.35, 1), opacity 0.28s ease;
}
.site-footer .animated-list ul li a::after {
  content: "\f178";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  font-size: 0.85rem;
  color: rgb(227, 190, 49);
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%) translateX(-14px) scaleX(0.6);
  transform-origin: left center;
  opacity: 0;
  transition: transform 0.38s cubic-bezier(0.65, 0, 0.35, 1), opacity 0.28s ease;
}
.site-footer .animated-list ul li a:hover, .site-footer .animated-list ul li a:focus-visible {
  color: rgb(227, 190, 49);
  padding-left: 2.1rem;
  background: linear-gradient(90deg, rgba(227, 190, 49, 0.08), transparent 85%);
}
.site-footer .animated-list ul li a:hover::before, .site-footer .animated-list ul li a:focus-visible::before {
  transform: translateY(-50%) translateX(12px) rotate(-90deg);
  opacity: 0;
}
.site-footer .animated-list ul li a:hover::after, .site-footer .animated-list ul li a:focus-visible::after {
  transform: translateY(-50%) translateX(0) scaleX(1);
  opacity: 1;
}
.site-footer .animated-list ul li + li {
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}
.site-footer .animated-list .widget,
.site-footer .animated-list .footer-widget {
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid rgba(255, 255, 255, 0.06);
  padding: 1rem 1rem 1.1rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}
.site-footer .animated-list .search-form {
  margin-top: 0.85rem;
}
.site-footer .animated-list .search-field {
  color: rgba(255, 255, 255, 0.82);
}
.site-footer .animated-list .search-field::placeholder {
  color: rgba(255, 255, 255, 0.34);
}
.site-footer .site-info {
  background-color: #0e0e0e;
  color: #fff;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-align: center;
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.5rem;
  padding: 0.8rem var(--layout-gutter);
  padding-inline: var(--layout-edge-padding);
}
.site-footer .site-info .designer a {
  position: relative;
  color: rgb(227, 190, 49);
  text-decoration: none;
  letter-spacing: 0.06em;
  transition: color 0.25s ease;
}
.site-footer .site-info .designer a::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: rgb(227, 190, 49);
  transition: width 0.25s ease;
}
.site-footer .site-info .designer a:hover::after {
  width: 100%;
}

/* 📱 Mobile only — hide the side titles so the centred logo can breathe.
   Tablets (iPad portrait and above) keep the full "Prenn ◆ Harbour" lockup. */
@media (max-width: 600px) {
  .site-footer__logo_title {
    display: none;
  }
}
/* 📱 Responsive: Hide image below 700px */
@media (max-width: 700px) {
  .site-footer__navs {
    flex-flow: column wrap;
    align-items: baseline;
    padding: 1.25rem var(--layout-gutter) 1.35rem;
  }
  .site-footer__navs > * {
    min-width: 100%;
    width: 100%;
    padding: 0;
  }
  .site-footer .site-info {
    justify-content: center;
    padding: 0.8rem var(--layout-gutter);
  }
}
/* Device-specific tuning */
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   iPad Portrait Optimisations
   --------------------------------------------------------------------------
   Targets tablets in portrait orientation (≈ 768px – 1024px wide).
   This is the awkward middle ground between mobile column-stacks and the
   full desktop grid: rules here keep layouts comfortable on iPad-class
   devices without affecting phones or desktops.

   Keep this file scoped to layout / spacing / sizing tweaks. Anything that
   should also apply on phones belongs in a `max-width: 700px` block in the
   component's own partial.
   ========================================================================== */
@media (min-width: 601px) and (max-width: 1024px) and (orientation: portrait) {
  /* --- Footer banner ------------------------------------------------------
     The "Prenn ◆ logo ◆ Harbour" lockup. Make sure the side titles stay
     visible and proportional alongside the central mark on iPad portrait. */
  .site-footer__logo {
    padding: 1.5rem 1rem 1.25rem;
    gap: 0.5rem;
  }
  .site-footer__logo_title {
    display: inline-block;
    font-size: clamp(1.25rem, 2.4vw, 1.75rem);
    margin: 0 0.75rem;
    letter-spacing: 0.16em;
    white-space: nowrap;
  }
  .site-footer__logo img,
  .site-footer__logo .custom-logo {
    height: clamp(4.5rem, 9vw, 6rem);
    max-width: clamp(5rem, 14vw, 8rem);
  }
  .site-footer {
    /* Footer nav columns sit two-up rather than four-up on iPad portrait. */
  }
  .site-footer__navs {
    gap: 1.25rem 1.75rem;
  }
  .site-footer__navs > * {
    flex: 1 1 calc(50% - 1.75rem);
    min-width: calc(50% - 1.75rem);
  }
  /* --- Contact / process panel -------------------------------------------
     Sits directly above the footer banner — stop it pushing the page
     too tall on iPad portrait. */
  .contact-section .process-panel {
    padding: 2.75rem 1.75rem;
  }
  .contact-section .process-panel__title {
    font-size: clamp(2rem, 5vw, 3rem);
  }
  /* --- Generic landing sections ------------------------------------------
     Trim vertical padding so portrait pages feel less stretched. */
  .section {
    padding: 3.5rem 0;
  }
  .section__header {
    margin-bottom: 2.5rem;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Service Sidebar Navigation
   ========================================================================== */
.service-sidebar > .service-sidebar__section {
  flex: 0 0 auto;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin: 0.9rem 0.85rem 0;
  padding: 1.55rem 1.3rem 1.45rem 1.45rem;
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 18px 36px rgba(4, 12, 17, 0.24);
}
.service-sidebar > .service-sidebar__section > * {
  position: relative;
  z-index: 1;
}
.service-sidebar > .service-sidebar__section + .service-sidebar__section {
  border-top: 0;
}
.service-sidebar > .service-sidebar__section:last-child {
  margin-bottom: 0.95rem;
}
.service-sidebar > .service-sidebar__section--siblings {
  border-color: rgba(227, 190, 49, 0.24);
  background: radial-gradient(circle at top right, rgba(227, 190, 49, 0.18), transparent 46%), linear-gradient(155deg, rgba(255, 255, 255, 0.09) 0%, rgba(255, 255, 255, 0.03) 20%, rgba(11, 24, 30, 0.98) 100%);
}
.service-sidebar > .service-sidebar__section--services {
  border-color: rgba(116, 177, 191, 0.24);
  background: radial-gradient(circle at top left, rgba(116, 177, 191, 0.16), transparent 44%), linear-gradient(155deg, rgba(17, 46, 57, 0.98) 0%, rgba(9, 26, 35, 0.98) 100%);
}
.service-sidebar > .service-sidebar__section--share {
  border-color: rgba(212, 162, 83, 0.24);
  background: radial-gradient(circle at bottom right, rgba(212, 162, 83, 0.18), transparent 50%), linear-gradient(155deg, rgba(37, 28, 19, 0.96) 0%, rgba(18, 21, 26, 0.98) 100%);
}

.service-sidebar__section--siblings .widget-title {
  color: rgb(227, 190, 49);
}

.service-sidebar__section--siblings .widget-title::after {
  background: linear-gradient(90deg, rgba(227, 190, 49, 0.95), rgba(227, 190, 49, 0.14));
}

.service-sidebar__section--services .widget-title {
  color: rgba(225, 245, 248, 0.96);
}

.service-sidebar__section--services .widget-title::after {
  background: linear-gradient(90deg, rgba(116, 177, 191, 0.9), rgba(116, 177, 191, 0.14));
}

.service-sidebar__section--share .widget-title {
  color: rgba(255, 238, 208, 0.96);
}

.service-sidebar__section--share .widget-title::after {
  background: linear-gradient(90deg, rgba(212, 162, 83, 0.9), rgba(212, 162, 83, 0.14));
}

.service-sidebar__nav li + li {
  border-top-color: rgba(255, 255, 255, 0.08);
}
.service-sidebar__nav a {
  font-weight: 700;
  color: rgba(255, 255, 255, 0.94);
}

.service-sidebar__section--siblings .service-sidebar__nav a::before {
  width: 0.48rem;
  background: rgba(227, 190, 49, 0.82);
}

.service-sidebar__section--services .service-sidebar__nav a::before {
  width: 0.48rem;
  background: rgba(116, 177, 191, 0.78);
}

.service-sidebar__share-copy {
  margin: 0;
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.88rem;
  line-height: 1.7;
}

.service-sidebar__share-copy {
  margin-bottom: 1rem;
}

.service-sidebar__share-links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}
.service-sidebar__share-links li,
.service-sidebar__share-links li + li {
  border-top: 0;
}

.service-sidebar__share-link {
  display: flex !important;
  align-items: center;
  justify-content: center;
  min-height: 3.25rem;
  padding: 0.9rem !important;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.84);
  text-decoration: none;
  transition: border-color 0.22s ease, background 0.22s ease, color 0.22s ease, transform 0.22s ease;
}
.service-sidebar__share-link::before {
  content: none !important;
}
.service-sidebar__share-link:hover, .service-sidebar__share-link:focus-visible {
  padding-left: 0.9rem !important;
  border-color: rgba(212, 162, 83, 0.52);
  background: rgba(212, 162, 83, 0.14);
  color: #fff;
  transform: translateY(-1px);
}
.service-sidebar__share-link i {
  width: 1.15rem;
  font-size: 1.15rem;
  text-align: center;
  color: rgba(255, 238, 208, 0.92);
}

/* ==========================================================================
   Service Page — Justified Masonry Gallery + Lightbox
   ========================================================================== */
.service-gallery-section {
  background: linear-gradient(180deg, #f6f3ec 0%, #fbfaf7 100%);
  padding: 2.75rem 1.75rem;
  border-top: 1px solid rgba(22, 47, 58, 0.12);
}
.service-gallery-section__header {
  text-align: center;
  margin-bottom: 1.75rem;
}
.service-gallery-section__header h3 {
  font-size: clamp(1.3rem, 3vw, 1.9rem);
  text-transform: uppercase;
  letter-spacing: 2.5px;
  font-weight: 800;
  color: #0e0e0e;
  margin: 0;
}
.service-gallery-section__header h3::after {
  content: "";
  display: block;
  width: 36px;
  height: 1px;
  background: rgba(227, 190, 49, 0.78);
  margin: 0.65rem auto 0;
}

.portfolio-entry__gallery {
  margin-top: 0;
}

.service-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
}

.service-gallery__item {
  overflow: hidden;
  position: relative;
  cursor: pointer;
  flex-shrink: 0;
}
.service-gallery__item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.35s ease;
}
.service-gallery__item:hover img, .service-gallery__item:focus-visible img {
  transform: scale(1.06);
}
.service-gallery__item:focus-visible {
  outline: 3px solid rgb(227, 190, 49);
  outline-offset: 2px;
}

.service-gallery__zoom {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.25s ease;
  border: none;
  padding: 0;
  cursor: pointer;
}
.service-gallery__zoom::after {
  content: "⌕";
  font-size: 2rem;
  color: white;
  opacity: 0;
  transform: scale(0.7);
  transition: opacity 0.25s ease, transform 0.25s ease;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
}
.service-gallery__item:hover .service-gallery__zoom, .service-gallery__item:focus-visible .service-gallery__zoom {
  background: rgba(0, 0, 0, 0.3);
}
.service-gallery__item:hover .service-gallery__zoom::after, .service-gallery__item:focus-visible .service-gallery__zoom::after {
  opacity: 1;
  transform: scale(1);
}

.service-lightbox {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 10000;
  align-items: center;
  justify-content: center;
}
.service-lightbox.is-open {
  display: flex;
}
.service-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.9);
  cursor: pointer;
}
.service-lightbox__stage {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  max-width: 92vw;
  max-height: 92vh;
  padding: 0;
}
.service-lightbox__img-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}
.service-lightbox__img {
  display: block;
  max-width: 82vw;
  max-height: 82vh;
  object-fit: contain;
  border-radius: 3px;
  box-shadow: 0 12px 60px rgba(0, 0, 0, 0.7);
}
.service-lightbox__caption {
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.78rem;
  letter-spacing: 0.5px;
  text-align: center;
  margin: 0;
  max-width: 60ch;
}
.service-lightbox__close {
  position: absolute;
  top: -2.75rem;
  right: -0.25rem;
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 2.2rem;
  line-height: 1;
  cursor: pointer;
  padding: 0.25rem 0.5rem;
  transition: color 0.2s ease;
}
.service-lightbox__close:hover, .service-lightbox__close:focus-visible {
  color: rgb(227, 190, 49);
  outline: none;
}
.service-lightbox__prev, .service-lightbox__next {
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.75);
  font-size: 3.5rem;
  line-height: 1;
  cursor: pointer;
  padding: 0.25rem 0.35rem;
  flex-shrink: 0;
  transition: color 0.2s ease, transform 0.15s ease;
  user-select: none;
  overflow: visible;
}
.service-lightbox__prev::after, .service-lightbox__next::after {
  content: none;
}
.service-lightbox__prev:hover:not(:disabled), .service-lightbox__prev:focus-visible:not(:disabled), .service-lightbox__next:hover:not(:disabled), .service-lightbox__next:focus-visible:not(:disabled) {
  color: rgb(227, 190, 49);
  transform: scale(1.15);
  outline: none;
}
.service-lightbox__prev:disabled, .service-lightbox__next:disabled {
  opacity: 0.2;
  cursor: default;
}

@media (max-width: 900px) {
  .service-gallery-section {
    padding: 2.5rem 1.25rem;
  }
}
@media (max-width: 600px) {
  .service-sidebar > .service-sidebar__section {
    margin-inline: 0.7rem;
  }
  .service-sidebar__share-links {
    grid-template-columns: 1fr;
  }
  .service-gallery-section {
    padding: 2rem 1rem;
  }
  .service-lightbox__img {
    max-width: 96vw;
    max-height: 70vh;
  }
  .service-lightbox__prev, .service-lightbox__next {
    font-size: 2.5rem;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Portfolio Single — reading-focused, single-column layout
   ========================================================================== */
/* Neutralise the generic .single .post card styles from posts-and-pages.
   The article still carries .post via post_class(), but we want a flat
   single-column read without the bordered/gradient card treatment. */
.single-portfolio .portfolio-entry.post {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
}
.single-portfolio .portfolio-entry.post::before {
  content: none;
}

.portfolio-reader {
  --reading-max: 68ch;
  --wide-max: 56rem;
  --full-max: 72rem;
  --reader-side: clamp(1.25rem, 4vw, 2.5rem);
  --reader-ink: #1a1a1a;
  --reader-ink-soft: rgba(26, 26, 26, 0.68);
  --reader-ink-mute: rgba(26, 26, 26, 0.5);
  --reader-rule: rgba(22, 47, 58, 0.1);
  position: relative;
  padding-top: calc(var(--site-header-offset, 8.5rem) + clamp(1rem, 3vw, 2rem));
  padding-bottom: clamp(3rem, 6vw, 5rem);
  background: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(227, 190, 49, 0.08), transparent 65%), linear-gradient(180deg, #fbf9f4 0%, #fefdfa 42%, #ffffff 100%);
  color: var(--reader-ink);
}

/* Reading progress bar */
.portfolio-reader__progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: rgba(22, 47, 58, 0.06);
  z-index: 9999;
  pointer-events: none;
}

.portfolio-reader__progress-bar {
  display: block;
  height: 100%;
  width: 100%;
  transform-origin: 0 50%;
  transform: scaleX(0);
  background: linear-gradient(90deg, rgb(227, 190, 49) 0%, #f4d150 60%, rgb(227, 190, 49) 100%);
  box-shadow: 0 0 12px rgba(227, 190, 49, 0.45);
  will-change: transform;
  transition: transform 0.08s linear;
}

/* ==========================================================================
   Article shell — a single centred column that uses `grid` to let specific
   children "break out" to wider sizes (hero, gallery) without the body text
   widening with them. Inspired by Ghost / Medium.
   ========================================================================== */
.portfolio-entry {
  display: grid;
  grid-template-columns: [full-start] minmax(var(--reader-side), 1fr) [wide-start] minmax(0, calc((var(--wide-max) - var(--reading-max)) / 2)) [main-start] minmax(0, var(--reading-max)) [main-end] minmax(0, calc((var(--wide-max) - var(--reading-max)) / 2)) [wide-end] minmax(var(--reader-side), 1fr) [full-end];
  row-gap: clamp(1.5rem, 3vw, 2.5rem);
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
}
.portfolio-entry > * {
  grid-column: main;
  min-width: 0;
}
.portfolio-entry > .portfolio-entry__hero,
.portfolio-entry > .portfolio-entry__gallery,
.portfolio-entry > .portfolio-entry__details {
  grid-column: wide;
}

/* Content blocks with alignwide / alignfull still get to breathe */
.portfolio-entry__content > .alignwide,
.portfolio-entry__content > .wp-block-image.alignwide,
.portfolio-entry__content > figure.alignwide {
  width: auto;
  margin-inline: calc((var(--wide-max) - var(--reading-max)) / -2);
  max-width: var(--wide-max);
}
.portfolio-entry__content > .alignfull {
  width: auto;
  margin-inline: calc((100vw - var(--reading-max)) / -2);
  max-width: 100vw;
}

/* ==========================================================================
   Header
   ========================================================================== */
.portfolio-entry__header {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: clamp(0.5rem, 2vw, 1.5rem);
}

.portfolio-entry__back {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.55rem 0.95rem 0.55rem 0.75rem;
  border: 1px solid var(--reader-rule);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.7);
  color: var(--reader-ink-soft);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: none;
  transition: border-color 0.22s ease, color 0.22s ease, transform 0.22s ease, background 0.22s ease;
}
.portfolio-entry__back i {
  font-size: 0.72rem;
  color: rgb(227, 190, 49);
  transition: transform 0.22s ease;
}
.portfolio-entry__back:hover, .portfolio-entry__back:focus-visible {
  border-color: rgba(227, 190, 49, 0.52);
  background: #fff;
  color: #0e0e0e;
  transform: translateX(-2px);
}
.portfolio-entry__back:hover i, .portfolio-entry__back:focus-visible i {
  transform: translateX(-2px);
}

.portfolio-entry__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: rgb(227, 190, 49);
}
.portfolio-entry__eyebrow::before {
  content: "";
  width: 2rem;
  height: 1px;
  background: linear-gradient(90deg, rgba(227, 190, 49, 0), rgb(227, 190, 49));
}

.portfolio-entry__title {
  margin: 0;
  font-size: clamp(2.1rem, 4.4vw + 0.5rem, 3.8rem);
  line-height: 1.04;
  letter-spacing: -0.01em;
  text-transform: none;
  font-weight: 800;
  color: #0e0e0e;
  text-wrap: balance;
  max-width: 22ch;
}

.portfolio-entry__dek {
  margin: 0;
  font-size: clamp(1.1rem, 0.6vw + 1rem, 1.35rem);
  line-height: 1.55;
  color: var(--reader-ink-soft);
  font-weight: 400;
  max-width: 56ch;
  text-wrap: pretty;
}

.portfolio-entry__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0 2.2rem;
  row-gap: 0.85rem;
  margin: 1rem 0 0;
  padding: 1.15rem 0 0;
  list-style: none;
  border-top: 1px solid var(--reader-rule);
}
.portfolio-entry__meta-item {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.portfolio-entry__meta-label {
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--reader-ink-mute);
}
.portfolio-entry__meta-value {
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--reader-ink);
  letter-spacing: 0.01em;
}

/* ==========================================================================
   Hero image — breaks out wider than the reading column
   ========================================================================== */
.portfolio-entry__hero {
  margin: clamp(0.5rem, 2vw, 1rem) 0 0;
}
.portfolio-entry__hero img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  object-fit: cover;
  border-radius: 4px;
  box-shadow: 0 1px 0 rgba(22, 47, 58, 0.06), 0 32px 60px -28px rgba(12, 22, 28, 0.35);
}

.portfolio-entry__hero-caption {
  margin: 0.85rem 0 0;
  padding-left: 0.85rem;
  border-left: 2px solid rgba(227, 190, 49, 0.65);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--reader-ink-mute);
  text-transform: uppercase;
}

/* ==========================================================================
   Inline project details bar (taxonomies)
   ========================================================================== */
.portfolio-entry__details {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1.2rem 2rem;
  padding: 1.4rem clamp(1rem, 2vw, 1.6rem);
  margin-top: 0.5rem;
  border: 1px solid var(--reader-rule);
  border-radius: 4px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.85), rgba(249, 246, 238, 0.75));
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.6) inset;
}

.portfolio-entry__detail {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.portfolio-entry__detail-label {
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--reader-ink-mute);
}

.portfolio-entry__detail-values {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.portfolio-entry__chip {
  display: inline-flex;
  align-items: center;
  padding: 0.38rem 0.68rem;
  border: 1px solid var(--reader-rule);
  border-radius: 999px;
  background: #fff;
  color: #0e0e0e;
  text-decoration: none;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  transition: border-color 0.22s ease, background 0.22s ease, color 0.22s ease, transform 0.22s ease;
}
.portfolio-entry__chip:hover, .portfolio-entry__chip:focus-visible {
  border-color: rgba(227, 190, 49, 0.55);
  background: rgba(227, 190, 49, 0.1);
  color: rgb(22, 47, 58);
  transform: translateY(-1px);
}

/* ==========================================================================
   Body typography — the reading experience
   ========================================================================== */
.portfolio-entry__content {
  font-size: clamp(1.05rem, 0.35vw + 1rem, 1.18rem);
  line-height: 1.78;
  color: var(--reader-ink);
  letter-spacing: 0.005em;
  font-feature-settings: "liga", "kern";
  hyphens: auto;
}
.portfolio-entry__content > * {
  margin: 0;
}
.portfolio-entry__content > * + * {
  margin-top: 1.4em;
}
.portfolio-entry__content p,
.portfolio-entry__content ul,
.portfolio-entry__content ol {
  max-width: var(--reading-max);
}
.portfolio-entry__content {
  /* Drop cap on the first paragraph */
}
.portfolio-entry__content > p:first-of-type::first-letter {
  float: left;
  margin: 0.1em 0.12em 0 0;
  padding: 0;
  font-size: 4.2em;
  line-height: 0.88;
  font-weight: 800;
  color: #0e0e0e;
  letter-spacing: -0.02em;
  font-feature-settings: "ss01";
}
.portfolio-entry__content h2,
.portfolio-entry__content h3,
.portfolio-entry__content h4 {
  color: #0e0e0e;
  line-height: 1.18;
  letter-spacing: -0.005em;
  font-weight: 800;
  text-wrap: balance;
}
.portfolio-entry__content > h2 {
  margin-top: 2.1em;
  font-size: clamp(1.55rem, 1.2vw + 1rem, 2.1rem);
}
.portfolio-entry__content > h2::before {
  content: "";
  display: block;
  width: 2.75rem;
  height: 2px;
  margin-bottom: 0.85rem;
  background: linear-gradient(90deg, rgb(227, 190, 49), rgba(227, 190, 49, 0.2));
}
.portfolio-entry__content > h3 {
  margin-top: 1.8em;
  font-size: clamp(1.25rem, 0.6vw + 1rem, 1.55rem);
}
.portfolio-entry__content > h4 {
  margin-top: 1.6em;
  font-size: 1.15rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--reader-ink-soft);
}
.portfolio-entry__content a {
  color: rgb(22, 47, 58);
  text-decoration: underline;
  text-decoration-color: rgba(227, 190, 49, 0.55);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.22em;
  transition: color 0.18s ease, text-decoration-color 0.18s ease;
}
.portfolio-entry__content a:hover, .portfolio-entry__content a:focus-visible {
  color: rgb(227, 190, 49);
  text-decoration-color: rgb(227, 190, 49);
}
.portfolio-entry__content strong {
  font-weight: 700;
}
.portfolio-entry__content em {
  font-style: italic;
}
.portfolio-entry__content ul, .portfolio-entry__content ol {
  padding-left: 1.35rem;
}
.portfolio-entry__content ul li + li, .portfolio-entry__content ol li + li {
  margin-top: 0.4em;
}
.portfolio-entry__content ul li::marker, .portfolio-entry__content ol li::marker {
  color: rgb(227, 190, 49);
}
.portfolio-entry__content {
  /* Pull quote — elegant, editorial */
}
.portfolio-entry__content blockquote {
  position: relative;
  max-width: var(--wide-max);
  margin: 2.4em calc((var(--wide-max) - var(--reading-max)) / -2);
  padding: 0 clamp(1.25rem, 3vw, 3rem);
  border: 0;
  background: transparent;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.3rem, 0.8vw + 1.1rem, 1.75rem);
  line-height: 1.4;
  font-style: italic;
  font-weight: 500;
  color: #0e0e0e;
  text-align: center;
  text-wrap: balance;
}
.portfolio-entry__content blockquote::before {
  content: "“";
  display: block;
  font-family: Georgia, serif;
  font-size: 4.5rem;
  line-height: 0.6;
  color: rgb(227, 190, 49);
  margin-bottom: 0.35em;
}
.portfolio-entry__content blockquote p {
  margin: 0;
  max-width: none;
}
.portfolio-entry__content blockquote cite {
  display: block;
  margin-top: 1rem;
  font-family: inherit;
  font-size: 0.78rem;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--reader-ink-mute);
}
.portfolio-entry__content {
  /* Images inside the flow */
}
.portfolio-entry__content figure,
.portfolio-entry__content .wp-block-image {
  margin-block: 1.8em;
}
.portfolio-entry__content figure img,
.portfolio-entry__content .wp-block-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 3px;
}
.portfolio-entry__content figure figcaption,
.portfolio-entry__content .wp-block-image figcaption {
  margin-top: 0.7rem;
  font-size: 0.82rem;
  color: var(--reader-ink-mute);
  text-align: center;
}
.portfolio-entry__content hr {
  max-width: 3rem;
  margin: 2.6em auto;
  border: 0;
  border-top: 1px solid var(--reader-rule);
  position: relative;
}
.portfolio-entry__content hr::before {
  content: "· · ·";
  position: absolute;
  top: -0.8em;
  left: 50%;
  transform: translateX(-50%);
  background: #fefdfa;
  padding: 0 0.75rem;
  color: rgba(227, 190, 49, 0.8);
  letter-spacing: 0.4em;
}
.portfolio-entry__content code {
  padding: 0.1em 0.4em;
  font-size: 0.92em;
  background: rgba(22, 47, 58, 0.06);
  border-radius: 3px;
}
.portfolio-entry__content pre {
  max-width: var(--wide-max);
  margin: 1.8em calc((var(--wide-max) - var(--reading-max)) / -2);
  padding: 1.25rem 1.5rem;
  border-radius: 4px;
  background: #0f1b21;
  color: #eae6da;
  font-size: 0.88rem;
  line-height: 1.6;
  overflow-x: auto;
}

/* ==========================================================================
   Gallery — breaks out wider
   ========================================================================== */
.portfolio-entry__gallery {
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
  padding-top: clamp(1.75rem, 3vw, 2.5rem);
  border-top: 1px solid var(--reader-rule);
}

.portfolio-entry__gallery-header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.6rem;
  margin-bottom: 1.4rem;
}

.portfolio-entry__gallery-title {
  margin: 0;
  font-size: clamp(1.45rem, 1.2vw + 1rem, 2rem);
  line-height: 1.1;
  font-weight: 800;
  color: #0e0e0e;
  letter-spacing: -0.005em;
}

.portfolio-entry__gallery .service-gallery {
  gap: 6px;
}

/* ==========================================================================
   Footer — share + CTA
   ========================================================================== */
.portfolio-entry__footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem;
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
  padding: 1.6rem 0;
  border-top: 1px solid var(--reader-rule);
  border-bottom: 1px solid var(--reader-rule);
}

.portfolio-entry__share {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.portfolio-entry__share-label {
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--reader-ink-mute);
}

.portfolio-entry__share-links {
  display: flex;
  gap: 0.5rem;
}

.portfolio-entry__share-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  border: 1px solid var(--reader-rule);
  border-radius: 999px;
  color: var(--reader-ink-soft);
  text-decoration: none;
  transition: border-color 0.22s ease, background 0.22s ease, color 0.22s ease, transform 0.22s ease;
}
.portfolio-entry__share-link:hover, .portfolio-entry__share-link:focus-visible {
  border-color: rgb(227, 190, 49);
  background: rgb(227, 190, 49);
  color: #0e0e0e;
  transform: translateY(-2px);
}

.portfolio-entry__footer-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.7rem 1.15rem;
  border: 1px solid rgb(227, 190, 49);
  border-radius: 999px;
  background: rgb(227, 190, 49);
  color: #0e0e0e;
  text-decoration: none;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  transition: transform 0.22s ease, box-shadow 0.22s ease, background 0.22s ease;
}
.portfolio-entry__footer-cta i {
  transition: transform 0.22s ease;
}
.portfolio-entry__footer-cta:hover, .portfolio-entry__footer-cta:focus-visible {
  transform: translateY(-2px);
  background: #f4d150;
  box-shadow: 0 14px 28px rgba(227, 190, 49, 0.3);
}
.portfolio-entry__footer-cta:hover i, .portfolio-entry__footer-cta:focus-visible i {
  transform: translateX(3px);
}

/* ==========================================================================
   Next/prev + related
   ========================================================================== */
.portfolio-reader__main {
  display: block;
}

.portfolio-reader__next-prev {
  max-width: var(--full-max);
  margin: clamp(2rem, 4vw, 3.5rem) auto 0;
  padding-inline: var(--reader-side);
}
.portfolio-reader__next-prev .nav-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.portfolio-reader__next-prev .nav-previous a,
.portfolio-reader__next-prev .nav-next a {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 1.4rem 1.6rem;
  border: 1px solid rgba(22, 47, 58, 0.1);
  border-radius: 4px;
  background: #fff;
  color: #0e0e0e;
  text-decoration: none;
  transition: border-color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
}
.portfolio-reader__next-prev .nav-previous a:hover, .portfolio-reader__next-prev .nav-previous a:focus-visible,
.portfolio-reader__next-prev .nav-next a:hover,
.portfolio-reader__next-prev .nav-next a:focus-visible {
  border-color: rgba(227, 190, 49, 0.55);
  transform: translateY(-3px);
  box-shadow: 0 18px 32px -16px rgba(12, 22, 28, 0.25);
}
.portfolio-reader__next-prev .nav-next {
  text-align: right;
}
.portfolio-reader__next-prev .nav-next a {
  align-items: flex-end;
}
.portfolio-reader__next-prev .post-nav__label {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgb(227, 190, 49);
}
.portfolio-reader__next-prev .post-nav__title {
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.28;
  color: #0e0e0e;
  max-width: 26ch;
}

.portfolio-reader__related {
  max-width: var(--full-max);
  margin: clamp(2.5rem, 5vw, 4rem) auto 0;
  padding-inline: var(--reader-side);
}

.portfolio-reader__related-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.4rem;
  padding-bottom: 1.1rem;
  border-bottom: 1px solid var(--reader-rule);
}

.portfolio-reader__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  width: 100%;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: rgb(227, 190, 49);
}
.portfolio-reader__eyebrow::before {
  content: "";
  width: 2rem;
  height: 1px;
  background: linear-gradient(90deg, rgba(227, 190, 49, 0), rgb(227, 190, 49));
}

.portfolio-reader__related-title {
  flex: 1 1 auto;
  margin: 0.4rem 0 0;
  font-size: clamp(1.45rem, 1.2vw + 1rem, 2rem);
  font-weight: 800;
  letter-spacing: -0.005em;
  color: #0e0e0e;
}

.portfolio-reader__related-link {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #0e0e0e;
  text-decoration: none;
  transition: color 0.22s ease, transform 0.22s ease;
}
.portfolio-reader__related-link i {
  color: rgb(227, 190, 49);
  transition: transform 0.22s ease;
}
.portfolio-reader__related-link:hover, .portfolio-reader__related-link:focus-visible {
  color: rgb(22, 47, 58);
}
.portfolio-reader__related-link:hover i, .portfolio-reader__related-link:focus-visible i {
  transform: translateX(3px);
}

.portfolio-reader__related-grid {
  display: grid;
  gap: clamp(1rem, 2vw, 1.5rem);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 720px) {
  .portfolio-reader {
    --reader-side: 1rem;
    --reading-max: 100%;
    --wide-max: 100%;
    padding-top: calc(var(--site-header-offset, 8.5rem) + 1rem);
  }
  .portfolio-entry {
    grid-template-columns: [main-start] minmax(0, 1fr) [main-end];
    row-gap: clamp(1.25rem, 5vw, 1.75rem);
    padding-inline: var(--reader-side);
  }
  .portfolio-entry > .portfolio-entry__hero,
  .portfolio-entry > .portfolio-entry__gallery,
  .portfolio-entry > .portfolio-entry__details {
    grid-column: main;
  }
  .portfolio-entry__title,
  .portfolio-entry__dek {
    max-width: none;
  }
  .portfolio-entry__meta {
    gap: 1rem 1.6rem;
  }
  .portfolio-entry__details {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .portfolio-entry__content {
    line-height: 1.72;
  }
  .portfolio-entry__content > p,
  .portfolio-entry__content > ul,
  .portfolio-entry__content > ol,
  .portfolio-entry__content > h2,
  .portfolio-entry__content > h3,
  .portfolio-entry__content > h4,
  .portfolio-entry__content > blockquote,
  .portfolio-entry__content > pre,
  .portfolio-entry__content > figure,
  .portfolio-entry__content > .wp-block-image,
  .portfolio-entry__content > .wp-block-columns,
  .portfolio-entry__content > .wp-block-media-text,
  .portfolio-entry__content > .wp-block-group,
  .portfolio-entry__content > .wp-block-cover,
  .portfolio-entry__content > .gallery,
  .portfolio-entry__content > .blocks-gallery-grid,
  .portfolio-entry__content > .wp-caption {
    max-width: 100%;
    min-width: 0;
  }
  .portfolio-entry__content > .alignwide,
  .portfolio-entry__content > .alignfull,
  .portfolio-entry__content > .wp-block-image.alignwide,
  .portfolio-entry__content > figure.alignwide {
    max-width: 100%;
    margin-inline: 0;
  }
  .portfolio-entry__content > p:first-of-type::first-letter {
    font-size: 3.4em;
  }
  .portfolio-entry__content blockquote {
    margin-inline: 0;
    padding: 0 0.5rem;
  }
  .portfolio-entry__content blockquote::before {
    font-size: 3rem;
  }
  .portfolio-entry__content pre {
    margin-inline: 0;
    padding-inline: 1rem;
  }
  .portfolio-reader__next-prev .nav-links {
    grid-template-columns: 1fr;
  }
  .portfolio-entry__footer {
    flex-direction: column;
    align-items: flex-start;
  }
  .portfolio-entry__footer-cta {
    align-self: stretch;
    justify-content: center;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
.site-header {
  --header-collapse-progress: 0;
  position: fixed;
  inset: 0 0 auto;
  z-index: 1200;
  padding: 0;
  color: #fff;
  pointer-events: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(180deg, rgba(11, 22, 28, 0.94), rgba(11, 22, 28, 0.8)), linear-gradient(90deg, rgba(227, 190, 49, 0.06), transparent 32%);
  box-shadow: 0 22px 54px rgba(0, 0, 0, 0.18);
  transition: background 0.24s ease, border-color 0.24s ease, box-shadow 0.24s ease;
}
.site-header::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: linear-gradient(90deg, rgba(227, 190, 49, 0), rgba(227, 190, 49, 0.9), rgba(227, 190, 49, 0));
  opacity: 0.8;
  pointer-events: none;
  transition: opacity 0.24s ease;
}

.site-header__inner {
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: var(--layout-grid-max);
  margin: 0 auto;
  padding: 0 var(--layout-gutter);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: calc(1.15rem - 0.3rem * var(--header-collapse-progress, 0)) calc(1.75rem - 0.45rem * var(--header-collapse-progress, 0));
  opacity: 1;
  pointer-events: auto;
  transition: padding 0.48s cubic-bezier(0.22, 1, 0.36, 1), gap 0.48s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.24s ease;
}

.site-header--has-logo .site-header__inner {
  padding: 0 var(--layout-gutter);
}

.site-header.is-scrolled {
  background: linear-gradient(180deg, rgba(10, 18, 23, 0.98), rgba(10, 18, 23, 0.9)), linear-gradient(90deg, rgba(227, 190, 49, 0.08), transparent 38%);
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: 0 28px 64px rgba(0, 0, 0, 0.24);
}

.site-header--has-logo.is-scrolled .site-header__inner {
  padding: 0.5rem var(--layout-gutter);
}

body.nav-open .site-header {
  background: linear-gradient(180deg, rgba(10, 18, 23, 0.985), rgba(10, 18, 23, 0.94)), linear-gradient(90deg, rgba(227, 190, 49, 0.08), transparent 38%);
  border-color: rgba(227, 190, 49, 0.2);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.2);
}

.site-branding {
  display: flex;
  align-items: center;
  gap: calc(1.3rem - 0.9rem * var(--header-collapse-progress, 0));
  min-width: 0;
  transition: gap 0.48s cubic-bezier(0.22, 1, 0.36, 1);
}

.custom-logo-link {
  width: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-height: calc(6.75rem - 6.75rem * var(--header-collapse-progress, 0));
  padding: 0;
  border: 1px solid transparent;
  border-radius: 2px;
  background: transparent;
  text-decoration: none;
  overflow: hidden;
  opacity: calc(1 - var(--header-collapse-progress, 0));
  transform: translate3d(0, calc(-0.5rem * var(--header-collapse-progress, 0)), 0) scale(calc(1 - 0.16 * var(--header-collapse-progress, 0)));
  transform-origin: left center;
  transition: min-height 0.48s cubic-bezier(0.22, 1, 0.36, 1), padding 0.48s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.48s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.24s ease, background 0.24s ease, transform 0.48s cubic-bezier(0.22, 1, 0.36, 1);
}
.custom-logo-link:hover, .custom-logo-link:focus-visible {
  border-color: transparent;
  background: transparent;
}

.custom-logo {
  display: block;
  width: auto;
  height: calc(4.505rem - 4.505rem * var(--header-collapse-progress, 0));
  max-width: clamp(5.1rem, 9.35vw, 7.8625rem);
  object-fit: contain;
  opacity: calc(1 - var(--header-collapse-progress, 0));
  transition: height 0.48s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.48s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-branding__copy {
  min-width: 0;
  display: grid;
  gap: calc(0.34rem - 0.14rem * var(--header-collapse-progress, 0));
  transition: gap 0.48s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-title,
.site-description {
  margin: 0;
  padding: 0;
}

.site-title {
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: calc(1.16rem - 0.2rem * var(--header-collapse-progress, 0));
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: calc(0.16em + 0.05em * var(--header-collapse-progress, 0));
  text-transform: uppercase;
  transition: font-size 0.48s cubic-bezier(0.22, 1, 0.36, 1), letter-spacing 0.48s cubic-bezier(0.22, 1, 0.36, 1);
}
.site-title a {
  color: #fff;
  text-decoration: none;
  transition: color 0.22s ease;
}
.site-title a:hover, .site-title a:focus-visible {
  color: rgb(227, 190, 49);
}

.site-description {
  max-width: 38ch;
  max-height: calc(2.4rem - 2.4rem * var(--header-collapse-progress, 0));
  color: rgba(255, 255, 255, 0.48);
  font-size: 0.66rem;
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  overflow: hidden;
  opacity: calc(1 - var(--header-collapse-progress, 0));
  transform: translateY(calc(-0.4rem * var(--header-collapse-progress, 0)));
  transition: max-height 0.48s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.48s cubic-bezier(0.22, 1, 0.36, 1), transform 0.48s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-header__nav-wrap {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: calc(0.85rem - 0.15rem * var(--header-collapse-progress, 0));
  min-width: 0;
  transition: gap 0.48s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-header__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: calc(3.3rem - 0.55rem * var(--header-collapse-progress, 0));
  padding: 0 calc(1.2rem - 0.1rem * var(--header-collapse-progress, 0));
  border: 1px solid rgba(227, 190, 49, 0.42);
  border-radius: 0;
  background: rgba(227, 190, 49, 0.12);
  color: #fff;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: calc(0.72rem - 0.02rem * var(--header-collapse-progress, 0));
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  transition: min-height 0.48s cubic-bezier(0.22, 1, 0.36, 1), padding 0.48s cubic-bezier(0.22, 1, 0.36, 1), font-size 0.48s cubic-bezier(0.22, 1, 0.36, 1), background 0.22s ease, border-color 0.22s ease, color 0.22s ease, transform 0.22s ease;
}
.site-header__cta:hover, .site-header__cta:focus-visible {
  transform: translateY(-1px);
  background: rgb(227, 190, 49);
  border-color: rgb(227, 190, 49);
  color: #0e0e0e;
}

.site-header.is-scrolled .custom-logo-link {
  border-color: transparent;
  background: transparent;
}

body.admin-bar .site-header {
  top: 32px;
}

@media (max-width: 900px) {
  .site-header__cta {
    display: none;
  }
}
@media (max-width: 782px) {
  body.admin-bar .site-header {
    top: 46px;
  }
}
@media (max-width: 640px) {
  .site-header__inner {
    padding: 0 var(--layout-gutter);
    gap: calc(0.85rem - 0.15rem * var(--header-collapse-progress, 0)) calc(0.8rem - 0.1rem * var(--header-collapse-progress, 0));
  }
  .site-header--has-logo .site-header__inner {
    padding: 0 var(--layout-gutter);
  }
  .site-header--has-logo.is-scrolled .site-header__inner {
    padding: 0.5rem var(--layout-gutter);
  }
  .site-branding {
    gap: calc(0.85rem - 0.45rem * var(--header-collapse-progress, 0));
  }
  .custom-logo-link {
    min-height: calc(4.6rem - 4.6rem * var(--header-collapse-progress, 0));
    padding: 0;
  }
  .custom-logo {
    height: calc(3.0175rem - 3.0175rem * var(--header-collapse-progress, 0));
    max-width: 4.8875rem;
  }
  .site-description {
    max-width: 30ch;
    font-size: 0.58rem;
    letter-spacing: 0.14em;
  }
  .site-title {
    font-size: calc(0.96rem - 0.12rem * var(--header-collapse-progress, 0));
    letter-spacing: calc(0.12em + 0.05em * var(--header-collapse-progress, 0));
  }
}
/* Navigation
--------------------------------------------- */
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
.main-navigation {
  position: relative;
  min-width: 0;
}

/* The desktop nav must handle two HTML structures:
   - Custom wp_nav_menu():   <ul class="menu"><li>
   - Fallback wp_page_menu(): <div class="menu"><ul><li>
   Selectors below tolerate both. */
.desktop-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  /* Top-level list — direct ul OR ul inside .menu div */
}
.desktop-nav > ul,
.desktop-nav > .menu,
.desktop-nav > .menu > ul {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: calc(0.2rem - 0.05rem * var(--header-collapse-progress, 0));
  margin: 0;
  padding: calc(0.28rem - 0.08rem * var(--header-collapse-progress, 0));
}
.desktop-nav {
  /* Top-level items */
}
.desktop-nav > ul > li,
.desktop-nav > .menu > li,
.desktop-nav > .menu > ul > li {
  position: relative;
  list-style: none;
  margin: 0;
}
.desktop-nav {
  /* Top-level links */
}
.desktop-nav > ul > li > a,
.desktop-nav > .menu > li > a,
.desktop-nav > .menu > ul > li > a {
  display: block;
  position: relative;
  padding: calc(1rem - 0.2rem * var(--header-collapse-progress, 0)) calc(1rem - 0.08rem * var(--header-collapse-progress, 0));
  color: rgba(255, 255, 255, 0.78);
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: calc(0.71rem - 0.03rem * var(--header-collapse-progress, 0));
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 0.22s ease, color 0.22s ease, padding 0.32s ease, font-size 0.32s ease;
}
.desktop-nav > ul > li > a::after,
.desktop-nav > .menu > li > a::after,
.desktop-nav > .menu > ul > li > a::after {
  content: "";
  position: absolute;
  left: 1rem;
  right: 1rem;
  bottom: 0.7rem;
  height: 1px;
  background: rgb(227, 190, 49);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.22s ease;
  opacity: 0.9;
}
.desktop-nav > ul > li > a:hover,
.desktop-nav > ul > li > a:focus-visible,
.desktop-nav > .menu > li > a:hover,
.desktop-nav > .menu > li > a:focus-visible,
.desktop-nav > .menu > ul > li > a:hover,
.desktop-nav > .menu > ul > li > a:focus-visible {
  background: rgba(255, 255, 255, 0.04);
  color: #fff;
}
.desktop-nav > ul > li > a:hover::after,
.desktop-nav > ul > li > a:focus-visible::after,
.desktop-nav > .menu > li > a:hover::after,
.desktop-nav > .menu > li > a:focus-visible::after,
.desktop-nav > .menu > ul > li > a:hover::after,
.desktop-nav > .menu > ul > li > a:focus-visible::after {
  transform: scaleX(1);
}
.desktop-nav {
  /* Current page / ancestor highlighting — covers wp_nav_menu + wp_page_menu classes */
}
.desktop-nav > ul > .current_page_item > a,
.desktop-nav > ul > .current-menu-item > a,
.desktop-nav > ul > .current_page_ancestor > a,
.desktop-nav > ul > .current-menu-ancestor > a,
.desktop-nav > .menu > .current_page_item > a,
.desktop-nav > .menu > .current-menu-item > a,
.desktop-nav > .menu > .current_page_ancestor > a,
.desktop-nav > .menu > .current-menu-ancestor > a,
.desktop-nav > .menu > ul > .current_page_item > a,
.desktop-nav > .menu > ul > .current-menu-item > a,
.desktop-nav > .menu > ul > .current_page_ancestor > a,
.desktop-nav > .menu > ul > .current-menu-ancestor > a {
  background: rgba(227, 190, 49, 0.12);
  color: #fff;
}
.desktop-nav > ul > .current_page_item > a::after,
.desktop-nav > ul > .current-menu-item > a::after,
.desktop-nav > ul > .current_page_ancestor > a::after,
.desktop-nav > ul > .current-menu-ancestor > a::after,
.desktop-nav > .menu > .current_page_item > a::after,
.desktop-nav > .menu > .current-menu-item > a::after,
.desktop-nav > .menu > .current_page_ancestor > a::after,
.desktop-nav > .menu > .current-menu-ancestor > a::after,
.desktop-nav > .menu > ul > .current_page_item > a::after,
.desktop-nav > .menu > ul > .current-menu-item > a::after,
.desktop-nav > .menu > ul > .current_page_ancestor > a::after,
.desktop-nav > .menu > ul > .current-menu-ancestor > a::after {
  transform: scaleX(1);
}
.desktop-nav {
  /* Parent indicator — covers both menu-item-has-children (nav menu) and page_item_has_children (page fallback) */
}
.desktop-nav > ul > .menu-item-has-children > a,
.desktop-nav > ul > .page_item_has_children > a,
.desktop-nav > .menu > .menu-item-has-children > a,
.desktop-nav > .menu > .page_item_has_children > a,
.desktop-nav > .menu > ul > .menu-item-has-children > a,
.desktop-nav > .menu > ul > .page_item_has_children > a {
  padding-right: 2rem;
}
.desktop-nav > ul > .menu-item-has-children > a::before,
.desktop-nav > ul > .page_item_has_children > a::before,
.desktop-nav > .menu > .menu-item-has-children > a::before,
.desktop-nav > .menu > .page_item_has_children > a::before,
.desktop-nav > .menu > ul > .menu-item-has-children > a::before,
.desktop-nav > .menu > ul > .page_item_has_children > a::before {
  content: "";
  position: absolute;
  right: 0.9rem;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 1.5px solid rgba(255, 255, 255, 0.55);
  border-bottom: 1.5px solid rgba(255, 255, 255, 0.55);
  transform: translateY(-60%) rotate(45deg);
  transition: transform 0.2s ease, border-color 0.2s ease;
}
.desktop-nav > ul > .menu-item-has-children:hover > a::before,
.desktop-nav > ul > .menu-item-has-children:focus-within > a::before,
.desktop-nav > ul > .menu-item-has-children.focus > a::before,
.desktop-nav > ul > .page_item_has_children:hover > a::before,
.desktop-nav > ul > .page_item_has_children:focus-within > a::before,
.desktop-nav > .menu > .menu-item-has-children:hover > a::before,
.desktop-nav > .menu > .menu-item-has-children:focus-within > a::before,
.desktop-nav > .menu > .menu-item-has-children.focus > a::before,
.desktop-nav > .menu > .page_item_has_children:hover > a::before,
.desktop-nav > .menu > .page_item_has_children:focus-within > a::before,
.desktop-nav > .menu > ul > .menu-item-has-children:hover > a::before,
.desktop-nav > .menu > ul > .menu-item-has-children:focus-within > a::before,
.desktop-nav > .menu > ul > .page_item_has_children:hover > a::before,
.desktop-nav > .menu > ul > .page_item_has_children:focus-within > a::before {
  transform: translateY(-20%) rotate(-135deg);
  border-color: rgb(227, 190, 49);
}
.desktop-nav {
  /* Dropdown — `.sub-menu` from wp_nav_menu, `.children` from wp_page_menu */
}
.desktop-nav .sub-menu,
.desktop-nav .children {
  position: absolute;
  top: calc(100% + 0.75rem);
  left: 50%;
  min-width: 240px;
  margin: 0;
  padding: 0.45rem;
  list-style: none;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 2px;
  background: linear-gradient(180deg, rgba(11, 22, 28, 0.98), rgba(11, 22, 28, 0.92)), linear-gradient(90deg, rgba(227, 190, 49, 0.08), transparent 45%);
  box-shadow: 0 24px 52px rgba(0, 0, 0, 0.24);
  opacity: 0;
  pointer-events: none;
  transform: translateX(-50%) translateY(8px);
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.desktop-nav .sub-menu::before,
.desktop-nav .children::before {
  content: "";
  position: absolute;
  inset: -0.75rem 0 auto;
  height: 0.75rem;
}
.desktop-nav .sub-menu::after,
.desktop-nav .children::after {
  content: "";
  position: absolute;
  top: -6px;
  left: 50%;
  width: 12px;
  height: 12px;
  background: rgb(11, 22, 28);
  border-left: 1px solid rgba(255, 255, 255, 0.08);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  transform: translateX(-50%) rotate(45deg);
}
.desktop-nav .sub-menu li,
.desktop-nav .children li {
  display: block;
  list-style: none;
  margin: 0;
}
.desktop-nav .sub-menu a,
.desktop-nav .children a {
  display: flex;
  align-items: center;
  padding: 0.72rem 0.85rem;
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: 0.02em;
  text-decoration: none;
  transition: background 0.18s ease, color 0.18s ease;
}
.desktop-nav .sub-menu a:hover, .desktop-nav .sub-menu a:focus-visible,
.desktop-nav .children a:hover,
.desktop-nav .children a:focus-visible {
  background: rgba(255, 255, 255, 0.05);
  color: rgb(227, 190, 49);
}
.desktop-nav .sub-menu,
.desktop-nav .children {
  /* Hide nested grandchildren from the page fallback to avoid a stacked dropdown */
}
.desktop-nav .sub-menu .children,
.desktop-nav .children .children {
  display: none;
}
.desktop-nav li:hover > .sub-menu,
.desktop-nav li:focus-within > .sub-menu,
.desktop-nav li.focus > .sub-menu,
.desktop-nav li:hover > .children,
.desktop-nav li:focus-within > .children,
.desktop-nav li.focus > .children {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

@media screen and (max-width: 1460px) {
  .desktop-nav > ul > li > a,
  .desktop-nav > .menu > li > a,
  .desktop-nav > .menu > ul > li > a {
    padding-inline: 0.85rem;
    font-size: 0.68rem;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
body.nav-open {
  overflow: hidden;
}

.menu-toggle {
  min-height: calc(3.3rem - 0.55rem * var(--header-collapse-progress, 0));
  padding: calc(0.68rem - 0.08rem * var(--header-collapse-progress, 0)) calc(0.9rem - 0.1rem * var(--header-collapse-progress, 0));
  display: none;
  align-items: center;
  gap: 0.7rem;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 0;
  background: rgba(255, 255, 255, 0.03);
  color: #fff;
  cursor: pointer;
  pointer-events: auto;
  position: relative;
  z-index: 8;
  transition: min-height 0.32s ease, padding 0.32s ease, background 0.22s ease, border-color 0.22s ease, transform 0.22s ease;
}
.menu-toggle:hover, .menu-toggle:focus-visible, .menu-toggle.active {
  border-color: rgba(227, 190, 49, 0.38);
  background: rgba(227, 190, 49, 0.1);
}

.menu-toggle__icon {
  position: relative;
  width: 20px;
  height: 14px;
  flex-shrink: 0;
}

.menu-toggle__line {
  position: absolute;
  left: 0;
  right: 0;
  height: 1.5px;
  border-radius: 999px;
  background: currentcolor;
  transform-origin: center;
  transition: transform 0.28s ease, opacity 0.2s ease;
}
.menu-toggle__line:nth-child(1) {
  top: 0;
}
.menu-toggle__line:nth-child(2) {
  top: 6px;
}
.menu-toggle__line:nth-child(3) {
  top: 12px;
}

.menu-toggle__text {
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: calc(0.68rem - 0.02rem * var(--header-collapse-progress, 0));
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  transition: font-size 0.32s ease;
}

.menu-toggle.active .menu-toggle__line:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}

.menu-toggle.active .menu-toggle__line:nth-child(2) {
  opacity: 0;
}

.menu-toggle.active .menu-toggle__line:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

.mobile-nav-overlay {
  position: fixed;
  top: var(--site-header-offset, 8.5rem);
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 5;
  background: rgba(4, 8, 11, 0);
  backdrop-filter: blur(0);
  pointer-events: none;
  transition: background 0.28s ease, backdrop-filter 0.28s ease;
}
.mobile-nav-overlay.active {
  background: rgba(4, 8, 11, 0.58);
  backdrop-filter: blur(6px);
  pointer-events: auto;
}

.mobile-nav {
  position: fixed;
  top: var(--site-header-offset, 8.5rem);
  left: 0;
  bottom: 0;
  width: min(420px, 100vw);
  z-index: 6;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-top: 0;
  border-left: 0;
  border-radius: 0 0 18px 0;
  background: linear-gradient(180deg, rgba(11, 22, 28, 0.98), rgba(11, 22, 28, 0.92)), linear-gradient(90deg, rgba(227, 190, 49, 0.08), transparent 42%);
  box-shadow: 22px 0 48px rgba(0, 0, 0, 0.22), 0 28px 64px rgba(0, 0, 0, 0.22);
  pointer-events: auto;
  transform: translate3d(calc(-100% - 2rem), 0, 0);
  transition: transform 0.34s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.24s ease;
  will-change: transform;
}
.mobile-nav::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: linear-gradient(90deg, rgba(227, 190, 49, 0), rgba(227, 190, 49, 0.9), rgba(227, 190, 49, 0));
  opacity: 0.82;
}

.mobile-nav__header {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding: calc(env(safe-area-inset-top, 0px) + 1.4rem) 1.25rem 1.15rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  flex-shrink: 0;
}

.mobile-nav__logo {
  display: block;
  width: auto;
  max-width: 140px;
  max-height: 56px;
  height: auto;
  object-fit: contain;
  object-position: left center;
  margin: 0;
  opacity: 0.95;
}

.mobile-nav__header-bar {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.6rem;
  flex-shrink: 0;
}

.mobile-nav__header-copy {
  min-width: 0;
  display: grid;
  gap: 0.28rem;
}

.mobile-nav__eyebrow {
  color: rgba(227, 190, 49, 0.88);
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.mobile-nav__site-name {
  color: #fff;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.mobile-nav__tagline {
  display: block;
  margin: 0;
  padding: 0 1.25rem 0.4rem;
  color: rgba(255, 255, 255, 0.6);
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 0.78rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0.01em;
  text-wrap: balance;
  /* Brand em-dash lead-in — subtle amber flourish that ties to the eyebrow palette */
}
.mobile-nav__tagline::before {
  content: "—  ";
  color: rgb(227, 190, 49);
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0;
  opacity: 0.85;
}

.mobile-nav__close {
  position: relative;
  margin-left: auto;
  width: 3rem;
  height: 3rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 0;
  background: rgba(255, 255, 255, 0.03);
  color: #fff;
  cursor: pointer;
  transition: border-color 0.22s ease, background 0.22s ease, color 0.22s ease, transform 0.22s ease;
}
.mobile-nav__close:hover, .mobile-nav__close:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(227, 190, 49, 0.38);
  background: rgba(227, 190, 49, 0.08);
  color: #fff;
}

.mobile-nav__close-line {
  position: absolute;
  width: 14px;
  height: 1.5px;
  border-radius: 999px;
  background: currentcolor;
}
.mobile-nav__close-line:first-child {
  transform: rotate(45deg);
}
.mobile-nav__close-line:last-child {
  transform: rotate(-45deg);
}

.mobile-nav > ul {
  list-style: none;
  margin: 0;
  padding: 0.8rem 0 1rem;
  display: flex;
  flex-direction: column;
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.mobile-nav > ul > li {
  position: relative;
  margin: 0;
  opacity: 0;
  transform: translateX(-12px);
  transition: opacity 0.26s ease, transform 0.26s ease;
}
.mobile-nav > ul > li:nth-child(1) {
  transition-delay: 0.07s;
}
.mobile-nav > ul > li:nth-child(2) {
  transition-delay: 0.1s;
}
.mobile-nav > ul > li:nth-child(3) {
  transition-delay: 0.13s;
}
.mobile-nav > ul > li:nth-child(4) {
  transition-delay: 0.16s;
}
.mobile-nav > ul > li:nth-child(5) {
  transition-delay: 0.19s;
}
.mobile-nav > ul > li:nth-child(6) {
  transition-delay: 0.22s;
}
.mobile-nav > ul > li:nth-child(7) {
  transition-delay: 0.25s;
}
.mobile-nav > ul > li:nth-child(8) {
  transition-delay: 0.28s;
}
.mobile-nav > ul > li:nth-child(9) {
  transition-delay: 0.31s;
}
.mobile-nav > ul > li:nth-child(10) {
  transition-delay: 0.34s;
}
.mobile-nav > ul > li + li {
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.mobile-nav.active > ul > li {
  opacity: 1;
  transform: translateX(0);
}

.mobile-nav > ul > li > a {
  display: flex;
  align-items: center;
  min-height: 3.75rem;
  padding: 1rem 3.8rem 1rem 1.25rem;
  color: rgba(255, 255, 255, 0.78);
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: none;
  transition: color 0.22s ease, background 0.22s ease, padding-left 0.22s ease;
}
.mobile-nav > ul > li > a:hover, .mobile-nav > ul > li > a:focus-visible {
  padding-left: 1.45rem;
  color: #fff;
  background: rgba(255, 255, 255, 0.04);
}

.mobile-nav > ul > .current-menu-item > a,
.mobile-nav > ul > .current_page_item > a,
.mobile-nav > ul > .current-menu-ancestor > a,
.mobile-nav > ul > .current_page_ancestor > a {
  color: #fff;
  background: rgba(227, 190, 49, 0.1);
}

.submenu-toggle {
  position: absolute;
  top: 0.6rem;
  right: 0.95rem;
  width: 2.45rem;
  height: 2.45rem;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 0;
  background: rgba(255, 255, 255, 0.03);
  color: rgba(255, 255, 255, 0.66);
  cursor: pointer;
  transition: border-color 0.22s ease, background 0.22s ease, color 0.22s ease;
}
.submenu-toggle span {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 11px;
  height: 1.5px;
  background: currentcolor;
  transform: translate(-50%, -50%);
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.submenu-toggle span:last-child {
  transform: translate(-50%, -50%) rotate(90deg);
}
.submenu-toggle:hover, .submenu-toggle:focus-visible {
  border-color: rgba(227, 190, 49, 0.38);
  background: rgba(227, 190, 49, 0.08);
  color: #fff;
}

.mobile-nav li.toggled > .submenu-toggle {
  border-color: rgba(227, 190, 49, 0.38);
  background: rgba(227, 190, 49, 0.08);
  color: #fff;
}
.mobile-nav li.toggled > .submenu-toggle span:last-child {
  opacity: 0;
}

.mobile-nav .sub-menu,
.mobile-nav .children {
  margin: 0;
  padding: 0 0 0.65rem;
  list-style: none;
  background: rgba(255, 255, 255, 0.02);
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.mobile-nav .sub-menu[hidden],
.mobile-nav .children[hidden] {
  display: none;
}
.mobile-nav .sub-menu li + li,
.mobile-nav .children li + li {
  border-top: 1px solid rgba(255, 255, 255, 0.04);
}
.mobile-nav .sub-menu a,
.mobile-nav .children a {
  display: flex;
  align-items: center;
  min-height: 3rem;
  padding: 0.8rem 1.25rem 0.8rem 2rem;
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.35;
  text-decoration: none;
  transition: color 0.18s ease, background 0.18s ease, padding-left 0.18s ease;
}
.mobile-nav .sub-menu a:hover, .mobile-nav .sub-menu a:focus-visible,
.mobile-nav .children a:hover,
.mobile-nav .children a:focus-visible {
  padding-left: 2.15rem;
  color: rgb(227, 190, 49);
  background: rgba(255, 255, 255, 0.03);
}

.mobile-nav__footer {
  display: grid;
  gap: 0.8rem;
  padding: 1.15rem 1.25rem 1.25rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  flex-shrink: 0;
}
.mobile-nav__footer span {
  display: block;
  color: rgba(255, 255, 255, 0.32);
  font-size: 0.62rem;
  line-height: 1.4;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.mobile-nav__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  padding: 0.9rem 1rem;
  border: 1px solid rgba(227, 190, 49, 0.42);
  border-radius: 0;
  background: rgba(227, 190, 49, 0.12);
  color: #fff;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 0.22s ease, border-color 0.22s ease, color 0.22s ease;
}
.mobile-nav__cta:hover, .mobile-nav__cta:focus-visible {
  background: rgb(227, 190, 49);
  border-color: rgb(227, 190, 49);
  color: #0e0e0e;
}

.mobile-nav.active {
  transform: translateX(0);
}

@media (max-width: 1199px) {
  .menu-toggle {
    display: inline-flex;
  }
  .desktop-nav {
    display: none;
  }
  body.nav-open .site-header,
  body.nav-open .site-header.is-shrunk,
  body.nav-open .site-header.is-hidden {
    background: transparent;
    background-color: transparent;
    border-color: transparent;
    box-shadow: none;
    /* Clear the smart-header shrink blur — otherwise the .is-shrunk strip
       stays painted as a translucent bar at the top of the viewport while
       the mobile nav is open. */
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    /* Cancel the smart-header hide transform so the header doesn't slide
       back into view as the user scrolls up with the nav open. */
    transform: none;
  }
  body.nav-open .site-header::before {
    opacity: 0;
  }
  body.nav-open .site-header__inner {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
  body.nav-open .mobile-nav,
  body.nav-open .mobile-nav-overlay {
    top: 0;
  }
}
@media (max-width: 640px) {
  .menu-toggle {
    min-width: 3rem;
    padding: 0.65rem 0.75rem;
  }
  .menu-toggle__text {
    display: none;
  }
  .mobile-nav {
    width: 100vw;
    border-radius: 0;
    box-shadow: 0 24px 52px rgba(0, 0, 0, 0.22);
  }
  .mobile-nav__header {
    padding: calc(env(safe-area-inset-top, 0px) + 1.1rem) 1rem 1rem;
  }
  .mobile-nav__tagline {
    padding: 0 1rem 0.35rem;
  }
}
@media (min-width: 1200px) {
  .mobile-nav,
  .mobile-nav-overlay {
    display: none;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
.animated-list ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.animated-list ul li {
  margin-bottom: 10px;
}
.animated-list ul li a {
  position: relative;
  padding-left: 1.7rem;
  font-size: 1rem;
  text-decoration: none;
  color: rgb(227, 190, 49);
  font-weight: 600;
  display: inline-block;
}
.animated-list ul li a::before {
  content: "\f105";
  font-family: "Font Awesome 7 Free";
  font-size: 1.3rem;
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%) translateX(0);
  opacity: 1;
  transition: all 0.3s ease;
}
.animated-list ul li a:hover::before {
  transform: translateY(-50%) translateX(10px);
  opacity: 0;
}
.animated-list ul li a:hover::after {
  transform: translateY(-50%) translateX(0);
  opacity: 1;
}
.animated-list ul li a::after {
  content: "\f061"; /* fa-arrow-right */
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  position: absolute;
  color: rgb(255, 255, 255);
  left: 0;
  top: 50%;
  transform: translateY(-50%) translateX(-10px);
  opacity: 0;
  transition: all 0.3s ease;
}
.animated-list .search-submit {
  position: relative;
  width: 40px;
  height: 40px;
  border: none;
  background: #333;
  color: transparent; /* hides "Search" text */
  cursor: pointer;
}
.animated-list .search-submit::before {
  content: "\f002"; /* magnifying glass */
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  font-size: 16px;
  color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* Content — posts and pages
--------------------------------------------- */
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Posts & Pages — content typography and layout utilities
   ========================================================================== */
.screen-reader-text {
  display: none;
}

.sticky {
  display: block;
}

.updated:not(.published) {
  display: none;
}

.page-links {
  clear: both;
  margin: 0 0 1.5em;
}

.page-content,
.entry-content {
  min-width: 0;
}

.entry-content pre,
.entry-content .wp-block-code,
.entry-content .wp-block-preformatted {
  max-width: 100%;
  overflow-x: auto;
}
.entry-content :where(p, li, a, span, strong, em, h1, h2, h3, h4, h5, h6, blockquote, figcaption) {
  overflow-wrap: anywhere;
}

/* Two-column body copy (wide layouts) */
.two-col p {
  column-count: 2;
  column-gap: 2rem;
}

@media (max-width: 1100px) {
  .two-col p {
    column-count: 1;
  }
}
/* ==========================================================================
   Entry meta
   ========================================================================== */
.entry-meta {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: rgba(0, 0, 0, 0.4);
  margin-bottom: 1.5rem;
}
.entry-meta a {
  color: rgba(190, 149, 0, 0.97);
  text-decoration: none;
}
.entry-meta a:hover {
  text-decoration: underline;
}

/* ==========================================================================
   Post navigation (single.php prev/next)
   ========================================================================== */
.post-navigation {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}
.post-navigation .nav-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}
.post-navigation .nav-previous a,
.post-navigation .nav-next a {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  text-decoration: none;
  padding: 1.25rem 1.5rem;
  border: 2px solid rgba(0, 0, 0, 0.07);
  border-radius: 0;
  background: #fafaf8;
  transition: border-color 0.22s ease, background 0.22s ease;
}
.post-navigation .nav-previous a:hover,
.post-navigation .nav-next a:hover {
  border-color: rgb(227, 190, 49);
  background: rgba(227, 190, 49, 0.05);
}
.post-navigation .nav-next {
  text-align: right;
}
.post-navigation .post-nav__label {
  display: block;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: rgb(227, 190, 49);
}
.post-navigation .post-nav__title {
  display: block;
  font-size: 0.9rem;
  font-weight: 600;
  color: #0e0e0e;
  line-height: 1.4;
}
@media (max-width: 600px) {
  .post-navigation .nav-links {
    grid-template-columns: 1fr;
  }
  .post-navigation .nav-next {
    text-align: left;
  }
}

/* ==========================================================================
   Full-width page variant (.page-wrapper--full)
   ========================================================================== */
.page-wrapper--full .site-main {
  width: 100%;
  padding: 3rem var(--layout-gutter);
  max-width: var(--layout-content-max);
  margin: 0 auto;
  background: transparent;
}

.page-content--centered {
  max-width: var(--layout-copy-max);
  margin: 0 auto;
}

/* ==========================================================================
   Single post page
   ========================================================================== */
.page-wrapper--single-post {
  position: relative;
  padding: 0;
  background: radial-gradient(circle at top left, rgba(22, 47, 58, 0.07), transparent 22%), linear-gradient(180deg, #f3efe5 0%, #f8f6f1 42%, #fcfbf8 100%);
}

.page-layout--single-post {
  align-items: start;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 2.5rem;
  max-width: var(--layout-grid-max);
  padding: clamp(2rem, 4vw, 3rem) var(--layout-gutter) clamp(3rem, 5vw, 4.5rem);
}
.page-layout--single-post > * {
  min-width: 0;
}
.page-layout--single-post > .site-main {
  padding: 0;
  background: transparent;
}

.page-content--single-post {
  position: relative;
}

.single .post {
  position: relative;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(249, 247, 242, 0.92) 100%);
  border: 1px solid rgba(22, 47, 58, 0.12);
  border-radius: 2px;
  box-shadow: none;
  overflow: hidden;
}
.single .post::before {
  content: "";
  position: absolute;
  top: 0;
  left: clamp(1.35rem, 3vw, 3.25rem);
  right: clamp(1.35rem, 3vw, 3.25rem);
  height: 1px;
  background: linear-gradient(90deg, rgba(22, 47, 58, 0.18), rgba(227, 190, 49, 0.42), rgba(22, 47, 58, 0));
  opacity: 0.9;
}
.single .entry-header {
  padding: clamp(2rem, 4vw, 3.5rem) clamp(1.35rem, 3vw, 3.25rem) 1.25rem;
}
.single .entry-title {
  font-size: clamp(1.75rem, 1.45rem + 1vw, 2rem);
  line-height: 1.02;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  max-width: 18ch;
  margin: 0;
  color: #0e0e0e;
}
.single .entry-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.85rem 1.4rem;
  font-size: 0.74rem;
  letter-spacing: 0.18em;
  color: rgba(37, 37, 37, 0.55);
  margin: 1rem 0 1.15rem;
}
.single .entry-reading-time {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.42rem 0.85rem 0.42rem 0.65rem;
  border: 1px solid rgba(227, 190, 49, 0.32);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(227, 190, 49, 0.12), rgba(227, 190, 49, 0.04));
  color: #0e0e0e;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
}
.single .entry-reading-time__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  background: rgb(227, 190, 49);
  color: #0e0e0e;
  font-size: 0.72rem;
}
.single .entry-reading-time__value {
  font-size: 0.86rem;
  font-weight: 800;
  letter-spacing: 0;
  color: #0e0e0e;
}
.single .entry-reading-time__unit {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: rgba(22, 47, 58, 0.62);
}
.single .post-thumbnail {
  margin: 0;
  padding: 0 clamp(1.35rem, 3vw, 3.25rem);
}
.single .post-thumbnail img {
  width: 100%;
  display: block;
  aspect-ratio: 16/9;
  object-fit: cover;
  border-radius: 2px;
  border: 1px solid rgba(22, 47, 58, 0.1);
  box-shadow: none;
}
.single .entry-content {
  max-width: 820px;
  margin: 0 auto;
  padding: 2rem clamp(1.35rem, 3vw, 3.25rem) clamp(2.5rem, 5vw, 3.5rem);
  color: rgba(37, 37, 37, 0.92);
  font-size: clamp(1rem, 1vw + 0.7rem, 1.15rem);
  line-height: 1.95;
}
.single .entry-content > * + * {
  margin-top: 1.4rem;
}
.single .entry-content p,
.single .entry-content ul,
.single .entry-content ol,
.single .entry-content blockquote {
  max-width: 68ch;
}
.single .entry-content h2,
.single .entry-content h3,
.single .entry-content h4 {
  max-width: 20ch;
  line-height: 1.1;
  color: #0e0e0e;
  margin-top: 2.4rem;
  margin-bottom: 0.9rem;
}
.single .entry-content h2 {
  font-size: clamp(1.6rem, 2vw + 1rem, 2.35rem);
}
.single .entry-content h3 {
  font-size: clamp(1.25rem, 1.2vw + 1rem, 1.7rem);
}
.single .entry-content a {
  color: rgb(22, 47, 58);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}
.single .entry-content a:hover {
  color: rgb(227, 190, 49);
}
.single .entry-content ul,
.single .entry-content ol {
  padding-left: 1.25rem;
}
.single .entry-content li + li {
  margin-top: 0.5rem;
}
.single .entry-content blockquote {
  margin-left: 0;
  padding: 1.5rem 1.5rem 1.5rem 1.75rem;
  border-left: 1px solid rgba(227, 190, 49, 0.9);
  border-radius: 0;
  background: linear-gradient(90deg, rgba(22, 47, 58, 0.05), rgba(22, 47, 58, 0) 76%);
  color: rgba(37, 37, 37, 0.85);
}
.single .entry-content blockquote p {
  margin: 0;
}
.single .entry-content img {
  border-radius: 2px;
}
.single .entry-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  padding: 0 clamp(1.35rem, 3vw, 3.25rem) clamp(2rem, 4vw, 2.75rem);
  color: rgba(37, 37, 37, 0.62);
  font-size: 0.82rem;
}
.single .post-navigation {
  margin-top: 2rem;
  border-top: none;
  padding-top: 0;
}
.single .post-navigation .nav-links {
  gap: 0.75rem;
}
.single .post-navigation .nav-previous,
.single .post-navigation .nav-next {
  position: relative;
}
.single .post-navigation .nav-previous a,
.single .post-navigation .nav-next a {
  position: relative;
  min-height: auto;
  gap: 0.38rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  overflow: hidden;
}
.single .post-navigation .nav-previous a::before,
.single .post-navigation .nav-next a::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(245, 241, 229, 0.52));
  opacity: 1;
  transition: background 0.22s ease, opacity 0.22s ease;
}
.single .post-navigation .nav-previous a::after,
.single .post-navigation .nav-next a::after {
  position: absolute;
  top: 0.95rem;
  font-family: "Font Awesome 7 Free";
  font-size: 0.7rem;
  font-weight: 900;
  color: rgba(22, 47, 58, 0.32);
  transition: transform 0.22s ease, color 0.22s ease;
}
.single .post-navigation .nav-previous a > *,
.single .post-navigation .nav-next a > * {
  position: relative;
  z-index: 1;
}
.single .post-navigation .nav-previous a::after {
  content: "\f060";
  left: 1rem;
}
.single .post-navigation .nav-next a::after {
  content: "\f061";
  right: 1rem;
}
.single .post-navigation .nav-previous a {
  padding-left: 2.25rem;
  padding-right: 1rem;
}
.single .post-navigation .nav-next a {
  padding-left: 1rem;
  padding-right: 2.25rem;
}
.single .post-navigation .nav-previous a,
.single .post-navigation .nav-next a {
  border: 1px solid rgba(22, 47, 58, 0.09);
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.64);
  box-shadow: none;
}
.single .post-navigation .nav-previous a:hover,
.single .post-navigation .nav-next a:hover {
  border-color: rgba(227, 190, 49, 0.46);
  transform: translateY(-1px);
}
.single .post-navigation .nav-previous a:hover::before,
.single .post-navigation .nav-next a:hover::before {
  opacity: 1;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(227, 190, 49, 0.06));
}
.single .post-navigation .nav-previous a:hover::after {
  color: rgb(227, 190, 49);
  transform: translateX(-2px);
}
.single .post-navigation .nav-next a:hover::after {
  color: rgb(227, 190, 49);
  transform: translateX(2px);
}
.single .post-navigation .post-nav__label {
  font-size: 0.55rem;
  letter-spacing: 0.2em;
  color: rgba(22, 47, 58, 0.52);
}
.single .post-navigation .post-nav__title {
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.3;
  max-width: 22ch;
  color: #0e0e0e;
}
.single .post-navigation .nav-previous .post-nav__label,
.single .post-navigation .nav-previous .post-nav__title {
  text-align: left;
}
.single .post-navigation .nav-next .post-nav__label,
.single .post-navigation .nav-next .post-nav__title {
  text-align: right;
}
.single .post-navigation .nav-next .post-nav__title {
  margin-left: auto;
}

.post-navigation-section {
  margin-top: 2.3rem;
}

.post-navigation-section__header {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  margin-bottom: 0.95rem;
  padding-left: 0.1rem;
}

.post-navigation-section__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgba(22, 47, 58, 0.52);
}
.post-navigation-section__eyebrow::after {
  content: "";
  width: 2.75rem;
  height: 1px;
  background: linear-gradient(90deg, rgba(227, 190, 49, 0.85), rgba(227, 190, 49, 0));
}

.post-navigation-section__title {
  margin: 0;
  font-size: clamp(1.2rem, 1.2vw + 0.85rem, 1.65rem);
  line-height: 1.12;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #0e0e0e;
}

.single-post-sidebar {
  position: relative;
  gap: 0;
  padding: 0;
  color: #f5f5f5;
  background: linear-gradient(180deg, rgba(18, 39, 48, 0.985) 0%, rgba(14, 30, 37, 0.985) 100%);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 0;
  box-shadow: 0 20px 44px rgba(15, 27, 34, 0.22);
  align-self: start;
}
.single-post-sidebar::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 2px;
  background: linear-gradient(180deg, rgba(227, 190, 49, 0.95), rgba(227, 190, 49, 0.18));
}
.single-post-sidebar::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 180px;
  height: 180px;
  background: radial-gradient(circle at top right, rgba(227, 190, 49, 0.08), transparent 74%);
  pointer-events: none;
}

.single-post-sidebar__panel {
  position: relative;
  padding: 1.45rem 1.45rem 1.55rem 1.85rem;
}
.single-post-sidebar__panel + .single-post-sidebar__panel {
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}
.single-post-sidebar__panel h3 {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin: 0 0 1.15rem;
  font-size: clamp(1.05rem, 0.9rem + 0.75vw, 1.3rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #fff;
}
.single-post-sidebar__panel h3::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  min-width: 2.75rem;
  background: linear-gradient(90deg, rgba(227, 190, 49, 0.75), rgba(227, 190, 49, 0.08));
}

.single-post-sidebar__search-copy {
  margin: 0 0 1rem;
  color: rgba(255, 255, 255, 0.56);
  font-size: 0.84rem;
  line-height: 1.7;
}

.single-post-sidebar__search-form {
  display: grid;
  gap: 0.7rem;
}

.single-post-sidebar__search-input {
  width: 100%;
  min-height: 50px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.02));
  color: #fff;
  padding: 0.95rem 1rem;
  font-size: 0.9rem;
  letter-spacing: 0.02em;
  transition: border-color 0.22s ease, box-shadow 0.22s ease, background 0.22s ease;
}
.single-post-sidebar__search-input::placeholder {
  color: rgba(255, 255, 255, 0.38);
}
.single-post-sidebar__search-input:focus {
  outline: none;
  border-color: rgba(227, 190, 49, 0.58);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.025));
  box-shadow: none;
}

.single-post-sidebar__search-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  min-height: 46px;
  width: 100%;
  border: 1px solid rgba(227, 190, 49, 0.26);
  border-radius: 0;
  background: linear-gradient(180deg, rgba(227, 190, 49, 0.12), rgba(227, 190, 49, 0.04));
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  cursor: pointer;
  transition: border-color 0.22s ease, background 0.22s ease, color 0.22s ease, transform 0.22s ease;
}
.single-post-sidebar__search-button i {
  font-size: 0.78rem;
  color: rgb(227, 190, 49);
}
.single-post-sidebar__search-button:hover, .single-post-sidebar__search-button:focus {
  outline: none;
  border-color: rgba(227, 190, 49, 0.72);
  background: linear-gradient(180deg, rgba(227, 190, 49, 0.18), rgba(227, 190, 49, 0.08));
  color: rgb(227, 190, 49);
  transform: none;
}

.single-post-sidebar__eyebrow {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgb(227, 190, 49);
  margin-bottom: 0.7rem;
}

.single-post-sidebar__meta,
.single-post-sidebar__nav {
  list-style: none;
  padding: 0;
  margin: 0;
}

.single-post-sidebar__meta {
  margin-top: 1.3rem;
}
.single-post-sidebar__meta li + li {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.single-post-sidebar__meta span {
  display: block;
  margin-bottom: 0.25rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.42);
}
.single-post-sidebar__meta strong,
.single-post-sidebar__meta a {
  color: #fff;
  font-size: 0.92rem;
  text-decoration: none;
}
.single-post-sidebar__meta a:hover {
  color: rgb(227, 190, 49);
}

.single-post-sidebar__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  margin-top: 1.5rem;
  padding: 0.82rem 0 0.1rem;
  border-radius: 0;
  background: transparent;
  color: #fff;
  text-decoration: none;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(227, 190, 49, 0.24);
  transition: border-color 0.22s ease, color 0.22s ease, transform 0.22s ease;
}
.single-post-sidebar__cta:hover {
  color: rgb(227, 190, 49);
  border-color: rgba(227, 190, 49, 0.85);
  transform: translateX(3px);
}

.portfolio-taxonomy-groups--sidebar {
  display: grid;
  gap: 1rem;
}

.portfolio-taxonomy-groups--sidebar .portfolio-taxonomy-group {
  display: grid;
  gap: 0.6rem;
}

.portfolio-taxonomy-groups--sidebar .portfolio-taxonomy-group__label {
  color: rgba(255, 255, 255, 0.44);
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.portfolio-taxonomy-groups--sidebar .portfolio-taxonomy-group__links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.portfolio-taxonomy-groups--sidebar .portfolio-taxonomy-link {
  border-color: rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.82);
}
.portfolio-taxonomy-groups--sidebar .portfolio-taxonomy-link:hover, .portfolio-taxonomy-groups--sidebar .portfolio-taxonomy-link:focus-visible {
  border-color: rgba(227, 190, 49, 0.42);
  background: rgba(227, 190, 49, 0.14);
  color: #fff;
}

.single-post-sidebar__nav li + li {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.single-post-sidebar__nav a {
  display: block;
  position: relative;
  padding: 0.95rem 0 0.95rem 1.25rem;
  color: rgba(255, 255, 255, 0.84);
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1.5;
  text-decoration: none;
  transition: color 0.2s ease, background-color 0.2s ease, padding-left 0.25s ease;
}
.single-post-sidebar__nav a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 0.42rem;
  height: 1px;
  background: rgba(227, 190, 49, 0.55);
  transform: translateY(-50%);
  transition: width 0.25s ease, background 0.25s ease;
}
.single-post-sidebar__nav a:hover, .single-post-sidebar__nav a:focus-visible {
  outline: none;
  color: rgb(227, 190, 49);
  padding-left: 1.55rem;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.045), transparent 85%);
}
.single-post-sidebar__nav a:hover .single-post-sidebar__link-title, .single-post-sidebar__nav a:focus-visible .single-post-sidebar__link-title {
  color: rgb(227, 190, 49);
}
.single-post-sidebar__nav a:hover::before, .single-post-sidebar__nav a:focus-visible::before {
  width: 0.72rem;
  background: rgb(227, 190, 49);
}

.single-post-sidebar__link-title {
  display: block;
  color: rgba(255, 255, 255, 0.84);
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1.5;
}

.single-post-sidebar__link-meta,
.single-post-sidebar__link-count {
  display: inline-flex;
  align-items: center;
  margin-top: 0.35rem;
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.36);
}

.single-post-sidebar__nav--categories a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.single-post-sidebar__nav--categories .single-post-sidebar__link-title {
  letter-spacing: 0.02em;
}

.single-post-sidebar__nav--categories .single-post-sidebar__link-count {
  margin-top: 0;
  color: rgba(227, 190, 49, 0.9);
}

/* ==========================================================================
   Single post sidebar — column wrapper + secondary aside
   ========================================================================== */
.single-post-aside-col {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  min-width: 0;
}

.single-post-sidebar--secondary {
  position: static;
  top: auto;
  max-height: none;
  overflow: visible;
  background: linear-gradient(180deg, rgba(14, 30, 37, 0.96) 0%, rgba(10, 22, 28, 0.96) 100%);
}

/* Ranked popular posts list */
.single-post-sidebar__nav--ranked {
  counter-reset: popular-rank;
}
.single-post-sidebar__nav--ranked li + li {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.single-post-sidebar__nav--ranked a {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  padding: 0.95rem 0 0.95rem 0;
}
.single-post-sidebar__nav--ranked a::before {
  content: none;
}
.single-post-sidebar__nav--ranked a:hover {
  padding-left: 0;
  background: transparent;
}
.single-post-sidebar__nav--ranked a:hover .single-post-sidebar__rank {
  color: rgb(227, 190, 49);
  border-color: rgba(227, 190, 49, 0.55);
}
.single-post-sidebar__nav--ranked a:hover .single-post-sidebar__link-title {
  color: rgb(227, 190, 49);
}

.single-post-sidebar__rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.62);
  transition: color 0.2s ease, border-color 0.2s ease;
}

.single-post-sidebar__rank-body {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}

/* Tag cloud */
.single-post-sidebar__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.single-post-sidebar__tag {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.42rem 0.75rem;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.76rem;
  line-height: 1;
  text-decoration: none;
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}
.single-post-sidebar__tag:hover, .single-post-sidebar__tag:focus-visible {
  outline: none;
  border-color: rgba(227, 190, 49, 0.42);
  background: rgba(227, 190, 49, 0.14);
  color: #fff;
}

.single-post-sidebar__tag-label {
  font-weight: 600;
  letter-spacing: 0.02em;
}

.single-post-sidebar__tag-count {
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: rgba(227, 190, 49, 0.9);
}

/* Newsletter panel */
.single-post-sidebar__panel--newsletter {
  background: radial-gradient(circle at top right, rgba(227, 190, 49, 0.1), transparent 62%);
}

.single-post-sidebar__newsletter-copy {
  margin: 0 0 1rem;
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.84rem;
  line-height: 1.7;
}

.single-post-sidebar__newsletter-form {
  display: grid;
  gap: 0.65rem;
}

.single-post-sidebar__newsletter-input {
  width: 100%;
  min-height: 50px;
  padding: 0.9rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.02));
  color: #fff;
  font-size: 0.9rem;
  letter-spacing: 0.02em;
}
.single-post-sidebar__newsletter-input::placeholder {
  color: rgba(255, 255, 255, 0.38);
}
.single-post-sidebar__newsletter-input:focus {
  outline: none;
  border-color: rgba(227, 190, 49, 0.58);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.025));
}

.single-post-sidebar__newsletter-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  min-height: 46px;
  width: 100%;
  padding: 0 1rem;
  border: 1px solid rgba(227, 190, 49, 0.32);
  border-radius: 0;
  background: linear-gradient(180deg, rgba(227, 190, 49, 0.16), rgba(227, 190, 49, 0.06));
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  cursor: pointer;
  transition: border-color 0.22s ease, background 0.22s ease, color 0.22s ease;
}
.single-post-sidebar__newsletter-button i {
  font-size: 0.82rem;
  color: rgb(227, 190, 49);
  transition: transform 0.22s ease;
}
.single-post-sidebar__newsletter-button:hover, .single-post-sidebar__newsletter-button:focus {
  outline: none;
  border-color: rgba(227, 190, 49, 0.78);
  background: linear-gradient(180deg, rgba(227, 190, 49, 0.22), rgba(227, 190, 49, 0.1));
  color: rgb(227, 190, 49);
}
.single-post-sidebar__newsletter-button:hover i, .single-post-sidebar__newsletter-button:focus i {
  transform: translateX(3px);
}

/* Follow / social panel */
.single-post-sidebar__follow {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.55rem;
}
.single-post-sidebar__follow li + li {
  border-top: 0;
}
.single-post-sidebar__follow a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 0.95rem 0.5rem !important;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.03);
  text-decoration: none;
  color: rgba(255, 255, 255, 0.78);
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}
.single-post-sidebar__follow a::before {
  content: none !important;
}
.single-post-sidebar__follow a:hover, .single-post-sidebar__follow a:focus-visible {
  outline: none;
  border-color: rgba(227, 190, 49, 0.42);
  background: rgba(227, 190, 49, 0.1);
  color: #fff;
  padding-left: 0.5rem !important;
}
.single-post-sidebar__follow a i {
  font-size: 1.1rem;
  color: rgb(227, 190, 49);
}
.single-post-sidebar__follow a span {
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

@media (max-width: 1200px) {
  .page-layout--single-post {
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 2rem;
  }
}
@media (max-width: 1100px) {
  .page-layout--single-post {
    grid-template-columns: 1fr;
  }
  .single-post-sidebar {
    display: flex !important;
    flex-direction: column;
    position: static;
    top: auto;
    max-height: none;
    overflow: visible;
    margin-top: 1rem;
  }
}
@media (max-width: 768px) {
  .page-wrapper--full .site-main,
  .page-layout--single-post > .site-main {
    padding-inline: 1rem;
  }
  .page-content > *,
  .entry-content > * {
    max-width: 100%;
    min-width: 0;
  }
  .entry-content .alignwide,
  .entry-content .alignfull,
  .entry-content .wp-block-columns,
  .entry-content .wp-block-media-text,
  .entry-content .wp-block-group,
  .entry-content .wp-block-cover,
  .entry-content .gallery,
  .entry-content .blocks-gallery-grid,
  .entry-content .wp-caption {
    max-width: 100%;
    min-width: 0;
    margin-left: 0;
    margin-right: 0;
  }
  .single .entry-title {
    max-width: none;
  }
  .single .entry-content {
    line-height: 1.8;
  }
  .single .post-navigation .nav-links {
    grid-template-columns: 1fr;
  }
  .single-post-sidebar__panel {
    padding: 1.2rem 1.1rem 1.3rem 1.35rem;
  }
}
@media (max-width: 640px) {
  .page-layout--single-post > .site-main {
    padding-inline: 0;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   404 Page
   ========================================================================== */
.error-404-wrapper {
  background: #0d0d0d;
  min-height: 82vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(var(--site-header-offset, 8.5rem) + clamp(1.5rem, 4vw, 3rem)) clamp(1rem, 4vw, 2rem) clamp(4rem, 8vw, 5rem);
}

.error-404 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  max-width: 1100px;
  width: 100%;
  align-items: center;
  /* Giant decorative number */
}
.error-404__number {
  font-size: clamp(8rem, 18vw, 16rem);
  font-weight: 900;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 2px rgba(227, 190, 49, 0.25);
  text-align: center;
  user-select: none;
  pointer-events: none;
  letter-spacing: -0.05em;
}
.error-404__content {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.error-404__content .section__eyebrow {
  color: rgb(227, 190, 49);
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 3px;
}
.error-404__title {
  font-size: clamp(1.8rem, 3.5vw, 2.8rem);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #fff;
  margin: 0;
  line-height: 1.1;
}
.error-404__title::after {
  content: "";
  display: block;
  width: 50px;
  height: 3px;
  background: rgb(227, 190, 49);
  margin-top: 0.6rem;
  border-radius: 2px;
}
.error-404__text {
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.7;
  margin: 0;
  max-width: 440px;
}
.error-404__search {
  margin-top: 0.5rem;
}
.error-404__search .search-form {
  display: flex;
}
.error-404__search input[type=search] {
  flex: 1;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-right: none;
  border-radius: 0;
  color: #fff;
  padding: 0.8rem 1.1rem;
  font-size: 0.9rem;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  text-transform: none;
}
.error-404__search input[type=search]::placeholder {
  color: rgba(255, 255, 255, 0.3);
}
.error-404__search input[type=search]:focus {
  outline: none;
  border-color: rgb(227, 190, 49);
}
.error-404__search input[type=submit] {
  background: rgb(227, 190, 49);
  border: 2px solid rgb(227, 190, 49);
  color: #0e0e0e;
  padding: 0.8rem 1.25rem;
  font-weight: 700;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-radius: 0;
  cursor: pointer;
  transition: background 0.22s ease, color 0.22s ease;
}
.error-404__search input[type=submit]:hover {
  background: transparent;
  color: rgb(227, 190, 49);
}

@media (max-width: 768px) {
  .error-404 {
    grid-template-columns: 1fr;
    gap: 1.5rem;
    text-align: center;
  }
  .error-404__number {
    font-size: clamp(6rem, 25vw, 10rem);
  }
  .error-404__title::after {
    margin: 0.6rem auto 0;
  }
  .error-404__text {
    max-width: 100%;
  }
  .error-404__search .search-form {
    flex-direction: column;
    gap: 0.5rem;
  }
  .error-404__search .search-form input[type=search] {
    border-right: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 0;
  }
  .error-404__search .search-form input[type=submit] {
    border-radius: 0;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Portfolio Archive + Cards
   ========================================================================== */
@keyframes portfolio-card-enter {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.archive-wrapper--portfolio {
  position: relative;
  overflow: clip;
  padding-top: calc(var(--site-header-offset, 8.5rem) + clamp(1.25rem, 3vw, 2.5rem));
  background: radial-gradient(circle at top left, rgba(227, 190, 49, 0.13), transparent 18%), radial-gradient(circle at bottom right, rgba(227, 190, 49, 0.08), transparent 20%), linear-gradient(180deg, #142a33 0%, #13272f 52%, #102028 100%);
}
.archive-wrapper--portfolio::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 300px;
  pointer-events: none;
  opacity: 0.14;
  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.08) 0 1px, transparent 1px 11rem);
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.45), transparent 86%);
}
.archive-wrapper--portfolio .blog-container {
  position: relative;
  z-index: 1;
}
.archive-wrapper--portfolio .archive-header__title {
  text-wrap: balance;
}

.archive-header--portfolio {
  max-width: 900px;
  padding: 0 0.1rem 2.4rem;
  border-bottom-color: rgba(255, 255, 255, 0.1);
}
.archive-header--portfolio .archive-header__eyebrow {
  color: rgba(227, 190, 49, 0.92);
}
.archive-header--portfolio .archive-header__eyebrow::after {
  background: linear-gradient(90deg, rgba(227, 190, 49, 0.82), rgba(227, 190, 49, 0));
}
.archive-header--portfolio .archive-header__title {
  max-width: 12ch;
  color: #fff;
  text-transform: uppercase;
}
.archive-header--portfolio .archive-header__desc {
  max-width: 64ch;
  color: rgba(255, 255, 255, 0.7);
  text-wrap: pretty;
}
.archive-header--portfolio .archive-header__desc p {
  margin: 0 0 0.75rem;
}
.archive-header--portfolio .archive-header__desc p:last-child {
  margin-bottom: 0;
}
.archive-header--portfolio .archive-header__desc a {
  color: rgb(227, 190, 49);
  text-decoration-color: rgba(227, 190, 49, 0.45);
}
.archive-header--portfolio .archive-header__desc a:hover, .archive-header--portfolio .archive-header__desc a:focus {
  color: #fff;
}

.portfolio-filters {
  display: grid;
  gap: 0.95rem;
  margin-bottom: clamp(1.6rem, 3vw, 2.5rem);
  padding: clamp(1rem, 2vw, 1.3rem);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 2px;
  box-shadow: none;
  backdrop-filter: none;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.02)), linear-gradient(180deg, rgba(8, 16, 20, 0.2), rgba(8, 16, 20, 0.08));
}

.portfolio-filter-tabs,
.portfolio-filter-group__links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.portfolio-filter-panel[hidden] {
  display: none;
}

.portfolio-filter-group__label {
  color: rgba(255, 255, 255, 0.48);
}

.portfolio-taxonomy-link,
.portfolio-entry__eyebrow-link,
.portfolio-card__term,
.portfolio-taxonomy-group {
  border-radius: 0;
}

.portfolio-filter-tab {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.65rem 1rem;
  border: 1px solid;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  cursor: pointer;
  transition: border-color 0.22s ease, background 0.22s ease, color 0.22s ease, transform 0.22s ease;
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.03);
  color: rgba(255, 255, 255, 0.72);
}
.portfolio-filter-tab:hover, .portfolio-filter-tab:focus-visible {
  border-color: rgba(227, 190, 49, 0.5);
  background: rgba(227, 190, 49, 0.12);
  color: #fff;
}
.portfolio-filter-tab.is-active {
  border-color: transparent;
  background: rgb(227, 190, 49);
  color: #0e0e0e;
}

.archive-wrapper--portfolio .portfolio-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem 0.9rem;
  border: 1px solid;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.01em;
  text-decoration: none;
  transition: border-color 0.22s ease, background 0.22s ease, color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
  border-color: rgba(255, 255, 255, 0.1);
  background: rgba(8, 16, 20, 0.34);
  color: rgba(255, 255, 255, 0.82);
}
.archive-wrapper--portfolio .portfolio-filter-chip:hover, .archive-wrapper--portfolio .portfolio-filter-chip:focus-visible {
  border-color: rgba(227, 190, 49, 0.52);
  background: rgba(227, 190, 49, 0.14);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 8px 18px -12px rgba(0, 0, 0, 0.55);
}
.archive-wrapper--portfolio .portfolio-filter-chip.is-active {
  border-color: transparent;
  background: rgb(227, 190, 49);
  color: #0e0e0e;
}

.portfolio-taxonomy-link,
.portfolio-entry__eyebrow-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  padding: 0.5rem 0.8rem;
  border: 1px solid rgba(22, 47, 58, 0.12);
  background: rgba(255, 255, 255, 0.78);
  color: rgb(22, 47, 58);
  text-decoration: none;
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  box-shadow: none;
  transition: transform 0.22s ease, border-color 0.22s ease, background 0.22s ease, color 0.22s ease;
}
.portfolio-taxonomy-link:hover, .portfolio-taxonomy-link:focus-visible,
.portfolio-entry__eyebrow-link:hover,
.portfolio-entry__eyebrow-link:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(227, 190, 49, 0.55);
  background: #fff;
  color: #0e0e0e;
  box-shadow: none;
}

.portfolio-entry__location {
  display: grid;
  justify-items: start;
  gap: 0.7rem;
  padding: 1.15rem clamp(1.35rem, 3vw, 3.25rem) 0;
}

.portfolio-entry__location-label {
  color: rgba(22, 47, 58, 0.5);
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.portfolio-entry__location-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.post-grid--portfolio {
  /* Tracks flex to fill the full row width so the grid spans the same
     horizontal extent as the .portfolio-filters bar above. auto-fit
     collapses empty tracks so a row never carries dead trailing slots. */
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
  gap: clamp(1rem, 2vw, 1.5rem);
  align-items: stretch;
}

.portfolio-empty--archive {
  margin: 1.5rem 0 0;
  padding: 1.2rem 1.25rem;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.035);
  color: rgba(255, 255, 255, 0.68);
  text-align: center;
}

.portfolio-empty--archive .portfolio-empty__title {
  margin: 0 0 0.55rem;
  color: #fff;
  font-size: clamp(1.1rem, 0.9vw + 0.95rem, 1.4rem);
  line-height: 1.2;
  letter-spacing: 0.02em;
}

.portfolio-empty--archive .portfolio-empty__text {
  margin: 0;
  line-height: 1.75;
}

.archive-wrapper--portfolio .archive-pagination {
  margin-top: 2.4rem;
}
.archive-wrapper--portfolio .archive-pagination .page-numbers {
  border-color: rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.72);
  background: rgba(255, 255, 255, 0.04);
}
.archive-wrapper--portfolio .archive-pagination .page-numbers.current {
  border-color: rgb(227, 190, 49);
  background: rgb(227, 190, 49);
  color: #0e0e0e;
}
.archive-wrapper--portfolio .archive-pagination .page-numbers:hover:not(.dots):not(.current) {
  border-color: rgba(227, 190, 49, 0.56);
  color: #fff;
  background: rgba(227, 190, 49, 0.1);
}
.archive-wrapper--portfolio .archive-pagination .page-numbers.dots {
  background: transparent;
  color: rgba(255, 255, 255, 0.36);
}

.post-card--portfolio {
  position: relative;
  overflow: clip;
  isolation: isolate;
  container-type: inline-size;
  border-radius: 0;
  border-color: rgba(255, 255, 255, 0.1);
  background: linear-gradient(180deg, #122429 0%, #0d1a1f 100%);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.24);
  backdrop-filter: none;
}
.post-card--portfolio::before {
  inset: 0 0 auto 0;
  width: auto;
  height: 2px;
  background: linear-gradient(90deg, rgba(227, 190, 49, 0), rgba(227, 190, 49, 0.95) 28%, rgba(227, 190, 49, 0.95) 72%, rgba(227, 190, 49, 0));
  opacity: 0;
  transform: scaleX(0.4);
  transform-origin: center;
  transition: opacity 0.32s ease, transform 0.42s ease;
}
.post-card--portfolio .post-card__link {
  position: relative;
  isolation: isolate;
  outline: none;
  gap: 0;
}
.post-card--portfolio .post-card__link:focus-visible {
  outline: 2px solid rgba(227, 190, 49, 0.72);
  outline-offset: -2px;
}
.post-card--portfolio .post-card__thumb {
  position: relative;
  inset: auto;
  aspect-ratio: 4/3;
  padding: 0;
  overflow: hidden;
}
.post-card--portfolio .post-card__thumb::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 55%;
  background: linear-gradient(180deg, rgba(6, 12, 16, 0) 0%, rgba(6, 12, 16, 0.55) 70%, rgba(6, 12, 16, 0.78) 100%);
  pointer-events: none;
  transition: opacity 0.32s ease;
}
.post-card--portfolio .post-card__thumb img,
.post-card--portfolio .post-card__thumb--portfolio-fallback {
  width: 100%;
  height: 100%;
  border-radius: 0;
}
.post-card--portfolio .post-card__thumb img {
  object-fit: cover;
  object-position: center;
  transition: transform 0.6s ease;
}
.post-card--portfolio .post-card__thumb--portfolio-fallback {
  background: radial-gradient(circle at top left, rgba(227, 190, 49, 0.3), transparent 24%), linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02)), linear-gradient(135deg, #1a3440 0%, #122730 100%);
  box-shadow: none;
}
.post-card--portfolio .post-card__category {
  position: absolute;
  z-index: 2;
  left: clamp(0.85rem, 2vw, 1.15rem);
  bottom: clamp(0.85rem, 2vw, 1.15rem);
  max-width: calc(100% - 2rem);
  padding: 0.5rem 0.7rem;
  background: rgba(227, 190, 49, 0.96);
  color: #0e0e0e;
  font-size: 0.62rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}
.post-card--portfolio .post-card-text {
  position: relative;
  z-index: 1;
  gap: 0.7rem;
  padding: clamp(1.05rem, 2vw, 1.4rem);
  background: transparent;
}
.post-card--portfolio .post-card__title {
  max-width: 22ch;
  color: #fff;
  font-size: clamp(1.15rem, 1vw + 0.95rem, 1.45rem);
  line-height: 1.18;
  text-wrap: balance;
}
.post-card--portfolio .post-card__excerpt {
  max-width: 42ch;
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.9rem;
  line-height: 1.55;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.post-card--portfolio .portfolio-card__terms {
  display: flex;
  flex-wrap: wrap;
  gap: 0.36rem;
  margin: 0.15rem 0 0;
  padding: 0;
  list-style: none;
}
.post-card--portfolio .portfolio-card__term {
  display: inline-flex;
  align-items: center;
  padding: 0.38rem 0.52rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.62rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  transition: border-color 0.28s ease, background 0.28s ease, color 0.28s ease;
}
.post-card--portfolio .post-card__footer {
  margin-top: 0.3rem;
  padding-top: 0.9rem;
  border-top-color: rgba(255, 255, 255, 0.08);
}
.post-card--portfolio .post-card__date {
  color: rgba(255, 255, 255, 0.42);
}
.post-card--portfolio .post-card__arrow {
  color: rgba(227, 190, 49, 0.94);
}
.post-card--portfolio.is-filter-entering {
  animation: portfolio-card-enter 0.38s ease both;
  animation-delay: var(--portfolio-stagger, 0ms);
}

@media (hover: hover) and (pointer: fine) {
  .post-card--portfolio:hover, .post-card--portfolio:focus-within {
    transform: translateY(-4px);
    border-color: rgba(227, 190, 49, 0.45);
    box-shadow: 0 32px 56px rgba(0, 0, 0, 0.3);
  }
  .post-card--portfolio:hover::before, .post-card--portfolio:focus-within::before {
    opacity: 1;
    transform: scaleX(1);
  }
  .post-card--portfolio:hover .post-card__thumb img, .post-card--portfolio:focus-within .post-card__thumb img {
    transform: scale(1.06);
  }
  .post-card--portfolio:hover .post-card__thumb::after, .post-card--portfolio:focus-within .post-card__thumb::after {
    background: linear-gradient(180deg, rgba(6, 12, 16, 0) 0%, rgba(6, 12, 16, 0.45) 70%, rgba(6, 12, 16, 0.7) 100%);
  }
  .post-card--portfolio:hover .portfolio-card__term, .post-card--portfolio:focus-within .portfolio-card__term {
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.07);
    color: rgba(255, 255, 255, 0.85);
  }
}
@supports selector(.post-card--portfolio:has(.post-card__link:focus-visible)) {
  .post-card--portfolio:has(.post-card__link:focus-visible) {
    border-color: rgba(227, 190, 49, 0.56);
  }
}
@container (max-width: 320px) {
  .post-card--portfolio .post-card-text {
    padding: 0.95rem;
  }
  .post-card--portfolio .post-card__title {
    max-width: none;
    font-size: 1rem;
  }
  .post-card--portfolio .post-card__footer {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
}
@media (max-width: 900px) {
  .archive-header--portfolio .archive-header__title {
    max-width: none;
  }
}
@media (max-width: 768px) {
  .archive-wrapper--portfolio {
    padding-top: calc(var(--site-header-offset, 8.5rem) + 1.25rem);
  }
  .portfolio-filters {
    gap: 0.8rem;
    padding: 1rem;
  }
  .portfolio-filter-tabs,
  .portfolio-filter-group__links {
    gap: 0.5rem;
  }
  .portfolio-filter-tab,
  .archive-wrapper--portfolio .portfolio-filter-chip {
    padding-inline: 0.85rem;
  }
  .post-grid--portfolio {
    gap: 1rem;
  }
  .post-card--portfolio .post-card__thumb {
    aspect-ratio: 3/2;
  }
}
@media (prefers-reduced-motion: reduce) {
  .post-card--portfolio,
  .post-card--portfolio * {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
/* Comments
--------------------------------------------- */
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
.comments-area {
  word-wrap: break-word;
  width: 50%;
}

/* ==========================================================================
   Comment Form
   ========================================================================== */
.comment-form p {
  margin-bottom: 1.1rem;
}
.comment-form label {
  display: block;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: rgba(0, 0, 0, 0.4);
  margin-bottom: 0.35rem;
}
.comment-form .required {
  color: rgb(227, 190, 49);
  margin-left: 0.15rem;
}
.comment-form input[type=text],
.comment-form input[type=email],
.comment-form input[type=url] {
  width: 100%;
  padding: 0.55rem 0;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 0.88rem;
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 0;
  color: #2d2d2d;
  transition: border-color 0.25s ease;
}
.comment-form input[type=text]::placeholder,
.comment-form input[type=email]::placeholder,
.comment-form input[type=url]::placeholder {
  color: rgba(0, 0, 0, 0.22);
}
.comment-form input[type=text]:focus,
.comment-form input[type=email]:focus,
.comment-form input[type=url]:focus {
  outline: none;
  border-bottom-color: rgb(227, 190, 49);
}
.comment-form textarea {
  width: 100%;
  min-height: 120px;
  padding: 0.65rem 0.8rem;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 0.88rem;
  background: rgba(0, 0, 0, 0.02);
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 0;
  color: #2d2d2d;
  resize: vertical;
  transition: border-color 0.25s ease, background 0.25s ease;
}
.comment-form textarea::placeholder {
  color: rgba(0, 0, 0, 0.22);
}
.comment-form textarea:focus {
  outline: none;
  border-color: rgb(227, 190, 49);
  background: rgba(227, 190, 49, 0.025);
}
.comment-form .form-submit {
  margin-top: 0.5rem;
  margin-bottom: 0;
}
.comment-form input[type=submit] {
  padding: 0.65rem 1.8rem;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.8px;
  border-radius: 0;
  cursor: pointer;
  background: rgb(227, 190, 49);
  color: #0e0e0e;
  border: 2px solid rgb(227, 190, 49);
  transition: background 0.25s ease, color 0.25s ease;
}
.comment-form input[type=submit]:hover {
  background: transparent;
  color: rgb(227, 190, 49);
}
.comment-form input[type=submit]:active {
  transform: translateY(1px);
}

.entry-meta {
  color: #838383;
  font-style: italic;
  margin-bottom: 0.5rem;
}

.bypostauthor {
  display: block;
}

.comment-list ::marker {
  font-size: clamp(2rem, 1.4rem + 2vw, 3rem);
  font-weight: 500;
  color: #b8b8b8;
}
.comment-list .comment {
  background-color: #f4f4f4;
  padding: 2rem;
  border-radius: 3px;
  box-shadow: inset -1px 1px 0px 2px #e1e1e1;
  margin-bottom: 2rem;
}
.comment-list .comment-author {
  margin-bottom: 0.6rem;
}
.comment-list .comment-metadata {
  font-size: 0.9rem;
  font-style: italic;
  margin-bottom: 0.6rem;
}
.comment-list .comment a {
  color: rgb(22, 47, 58);
  text-transform: uppercase;
}

.single-post .comments-area {
  width: min(100%, 54rem);
  margin-top: 3rem;
}
.single-post .comment-list {
  list-style: none;
  margin: 1.6rem 0 0;
  padding: 0;
  counter-reset: single-post-comment;
}
.single-post .comment-list .children {
  list-style: none;
  margin: 1.1rem 0 0 1.35rem;
  padding: 0;
}
.single-post .comment-list > .comment,
.single-post .comment-list .children > .comment {
  position: relative;
  counter-increment: single-post-comment;
  padding: 2rem 1.6rem 1.7rem;
  border: 1px solid rgba(22, 47, 58, 0.12);
  background: radial-gradient(circle at top right, rgba(227, 190, 49, 0.12), transparent 28%), linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 244, 237, 0.92));
  box-shadow: 0 18px 36px rgba(15, 27, 34, 0.08);
}
.single-post .comment-list > .comment::after,
.single-post .comment-list .children > .comment::after {
  content: counter(single-post-comment, decimal-leading-zero);
  position: absolute;
  top: 0.55rem;
  right: 1rem;
  font-size: clamp(2.6rem, 5vw, 4rem);
  font-weight: 800;
  letter-spacing: -0.08em;
  line-height: 1;
  color: rgba(22, 47, 58, 0.32);
  pointer-events: none;
}
.single-post .comment-list .comment-author,
.single-post .comment-list .comment-metadata,
.single-post .comment-list .comment-content,
.single-post .comment-list .reply {
  position: relative;
  z-index: 1;
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
  margin: 0 0 1.5em;
}
.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  margin: 2rem 0;
}
.comment-navigation .nav-links a,
.posts-navigation .nav-links a,
.post-navigation .nav-links a {
  text-decoration: none;
  font-size: 1rem;
  font-weight: 600;
  text-transform: uppercase;
  color: rgb(82, 82, 82);
  padding: 1rem;
  background-color: #f5f5f5;
  border-radius: 40px;
  border: 1px solid #cfcfcf;
}
.comment-navigation .nav-links a:hover,
.posts-navigation .nav-links a:hover,
.post-navigation .nav-links a:hover {
  background-color: #fff;
  border: 1px solid;
  color: #252525;
}
.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
  flex: 1 0 50%;
}
.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
  text-align: end;
  flex: 1 0 50%;
}

@media (max-width: 640px) {
  .comments-area {
    width: 100%;
    max-width: 100%;
  }
  .comment-list .comment {
    padding: 1.25rem;
  }
  .single-post .comment-list .children {
    margin-left: 0.85rem;
  }
  .single-post .comment-list > .comment,
  .single-post .comment-list .children > .comment {
    padding: 4.15rem 1.1rem 1.2rem;
  }
  .single-post .comment-list > .comment::before,
  .single-post .comment-list .children > .comment::before {
    top: 1rem;
    left: 1rem;
  }
  .single-post .comment-list > .comment::after,
  .single-post .comment-list .children > .comment::after {
    top: 0.85rem;
    right: 0.85rem;
    font-size: clamp(1.6rem, 1.1rem + 1.6vw, 2.35rem);
  }
}
/* Widgets
--------------------------------------------- */
.widget {
  margin: 0 0 1.5em;
}
.widget select {
  max-width: 100%;
}

/* Media
--------------------------------------------- */
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
.testimonials {
  padding: 2rem;
  background-color: rgba(77, 77, 77, 0.83);
  border-top: 1.5rem solid;
}
.testimonials-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}
.testimonials-track {
  display: flex;
  transition: transform 0.6s ease;
}
.testimonials-slider {
  overflow: hidden;
  position: relative;
}
.testimonials .testimonial {
  background: #0e0e0e;
  color: #fff;
  padding: 2rem;
  border-left: 4px solid rgb(227, 190, 49);
}
.testimonials .testimonial-slide {
  min-width: 100%;
  box-sizing: border-box;
}
.testimonials .testimonial__author {
  font-size: 0.9rem;
  font-style: italic;
  color: grey;
}

@media (max-width: 900px) {
  .testimonials-row {
    grid-template-columns: 1fr;
  }
}
/* Captions
--------------------------------------------- */
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
.wp-caption {
  margin-bottom: 1.5em;
  max-width: 100%;
}
.wp-caption img[class*=wp-image-] {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.wp-caption .wp-caption-text {
  margin: 0.8075em 0;
}

.wp-caption-text {
  text-align: center;
}

/* Galleries
--------------------------------------------- */
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
.gallery {
  margin-bottom: 1.5em;
  display: grid;
  grid-gap: 1.5em;
}

.gallery-item {
  display: inline-block;
  text-align: center;
  width: 100%;
}

.gallery-columns-2 {
  grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
  grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
  grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
  grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
  grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
  grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
  grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
  grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
  display: block;
}

.portfolio-gallery {
  border-top: 7px solid rgb(227, 190, 49);
}
.portfolio-gallery_header {
  text-align: center;
  background-color: #0e0e0e;
  color: white;
}
.portfolio-gallery_header h3 {
  font-size: clamp(2rem, -0.068rem + 2.727vw, 3rem);
  font-weight: 900;
  text-transform: uppercase;
  border-bottom: 7px solid rgb(227, 190, 49);
  margin: 0 0 1.8rem;
  padding: 1.4rem 0 1rem;
}

/* UX enhancements (paired with src/js/enhancements.js)
--------------------------------------------- */
/* -------------------------------------------------------------------------
 * UX enhancement styles paired with src/js/enhancements.js
 *
 * Each block is paired with the JS effect of the same name. Anything that
 * adds motion respects (prefers-reduced-motion: reduce).
 * ---------------------------------------------------------------------- */
/* Skip-link visibility -------------------------------------------------- */
.skip-link {
  position: absolute;
  left: -9999px;
  top: -9999px;
}
.skip-link:focus {
  left: 1rem;
  top: 1rem;
  z-index: 100000;
  background: #111;
  color: #fff;
  padding: 0.6rem 1rem;
  border-radius: 4px;
  text-decoration: none;
  font-weight: 600;
  outline: 2px solid #fff;
  outline-offset: 2px;
}

/* Breadcrumbs ----------------------------------------------------------- */
.pw-breadcrumbs {
  max-width: 1200px;
  margin: 1.25rem auto 1rem;
  padding: 0 1.25rem;
  font-size: 0.85rem;
  color: rgba(0, 0, 0, 0.6);
}

/* When breadcrumbs are the first page content after the header stack
   (no hero before), push them down so they clear the fixed site header.
   .mobile-nav-overlay is the last sibling rendered alongside the header. */
.mobile-nav-overlay + .pw-breadcrumbs {
  margin-top: calc(var(--site-header-offset, 8.5rem) + 0.75rem);
}

.pw-breadcrumbs__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}
.pw-breadcrumbs__item {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.pw-breadcrumbs__link {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 180ms ease, color 180ms ease;
}
.pw-breadcrumbs__link:hover, .pw-breadcrumbs__link:focus-visible {
  color: #000;
  border-bottom-color: currentColor;
}
.pw-breadcrumbs__sep {
  opacity: 0.4;
}
.pw-breadcrumbs__current {
  color: rgba(0, 0, 0, 0.85);
  font-weight: 600;
}

/* When breadcrumbs sit inside the dark services archive wrapper, drop the
   default max-width/padding so they share the .blog-container column, and
   recolour for the dark gold backdrop. */
.archive-wrapper--services .pw-breadcrumbs {
  max-width: none;
  margin: 0 0 1.4rem;
  padding: 0 0.1rem;
  color: rgba(255, 255, 255, 0.55);
}
.archive-wrapper--services .pw-breadcrumbs .pw-breadcrumbs__link {
  color: inherit;
}
.archive-wrapper--services .pw-breadcrumbs .pw-breadcrumbs__link:hover, .archive-wrapper--services .pw-breadcrumbs .pw-breadcrumbs__link:focus-visible {
  color: #fff;
  border-bottom-color: rgba(227, 190, 49, 0.7);
}
.archive-wrapper--services .pw-breadcrumbs .pw-breadcrumbs__sep {
  color: rgba(227, 190, 49, 0.45);
  opacity: 1;
}
.archive-wrapper--services .pw-breadcrumbs .pw-breadcrumbs__current {
  color: rgba(227, 190, 49, 0.92);
}

/* Smart header (shrink + hide) ---------------------------------------- */
.site-header {
  transition: transform 320ms cubic-bezier(0.2, 0.8, 0.2, 1), background-color 220ms ease, padding 220ms ease, box-shadow 220ms ease;
  will-change: transform;
}
.site-header.is-shrunk {
  backdrop-filter: blur(10px);
  background-color: rgba(255, 255, 255, 0.94);
  box-shadow: 0 6px 20px -10px rgba(0, 0, 0, 0.18);
}
.site-header.is-hidden {
  transform: translateY(-100%);
}

/* Hero parallax ------------------------------------------------------- */
.hero__main {
  overflow: hidden;
  position: relative;
}
.hero__main .hero__image {
  will-change: transform;
  transition: transform 50ms linear;
}

@media (prefers-reduced-motion: reduce) {
  .hero__main .hero__image {
    transform: none !important;
  }
}
/* Image fade-in -------------------------------------------------------- */
.post-card__thumb img,
.service-gallery__item img,
.portfolio-entry__hero img {
  opacity: 0;
  transform: scale(1.02);
  transition: opacity 520ms ease, transform 720ms cubic-bezier(0.2, 0.8, 0.2, 1);
}
.post-card__thumb img.is-loaded,
.service-gallery__item img.is-loaded,
.portfolio-entry__hero img.is-loaded {
  opacity: 1;
  transform: scale(1);
}

@media (prefers-reduced-motion: reduce) {
  .post-card__thumb img,
  .service-gallery__item img,
  .portfolio-entry__hero img {
    opacity: 1 !important;
    transform: none !important;
    transition: none;
  }
}
/* Related case studies on the service page ---------------------------- */
.service-related-case-studies {
  margin: 4rem auto;
  max-width: 1200px;
  padding: 0 1.25rem;
}
.service-related-case-studies__header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.75rem 1.5rem;
  margin-bottom: 1.75rem;
}
.service-related-case-studies__eyebrow {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: rgba(0, 0, 0, 0.55);
  flex-basis: 100%;
}
.service-related-case-studies__title {
  margin: 0;
  font-size: clamp(1.4rem, 2.4vw, 1.8rem);
}
.service-related-case-studies__link {
  margin-left: auto;
  text-decoration: none;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.service-related-case-studies__link i {
  transition: transform 200ms ease;
}
.service-related-case-studies__link:hover i, .service-related-case-studies__link:focus-visible i {
  transform: translateX(4px);
}
.service-related-case-studies__grid {
  margin-top: 0;
}

/* Services used on this case study (block beneath the article body) --- */
.portfolio-reader__services {
  max-width: 760px;
  margin: 3rem auto;
  padding: 1.75rem 1.75rem 1.5rem;
  background: linear-gradient(180deg, rgba(18, 39, 48, 0.985) 0%, rgba(14, 30, 37, 0.985) 100%);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 0;
  color: #f5f5f5;
  box-shadow: 0 20px 44px rgba(15, 27, 34, 0.22);
}
.portfolio-reader__services-header {
  margin-bottom: 1.2rem;
}
.portfolio-reader__services-title {
  margin: 0.4rem 0 0;
  font-size: clamp(1.1rem, 1vw + 0.85rem, 1.4rem);
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #fff;
}
.portfolio-reader__services .portfolio-reader__eyebrow {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: rgba(227, 190, 49, 0.7);
}
.portfolio-reader__services-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}

.portfolio-reader__service-link {
  display: grid;
  gap: 0.35rem;
  text-decoration: none;
  color: rgba(255, 255, 255, 0.84);
  padding: 0.95rem 1rem;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 0;
  transition: border-color 0.22s ease, background 0.22s ease, transform 0.22s ease;
}
.portfolio-reader__service-link:hover, .portfolio-reader__service-link:focus-visible {
  border-color: rgba(227, 190, 49, 0.4);
  background: rgba(255, 255, 255, 0.06);
  transform: translateY(-1px);
  outline: none;
}

.portfolio-reader__service-title {
  font-weight: 700;
  color: #fff;
}

.portfolio-reader__service-excerpt {
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.9rem;
  line-height: 1.55;
}

.portfolio-reader__service-cta {
  margin-top: 0.5rem;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.7rem;
  font-weight: 700;
  color: rgb(227, 190, 49);
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
.portfolio-reader__service-cta i {
  transition: transform 0.22s ease;
}

.portfolio-reader__service-link:hover .portfolio-reader__service-cta i,
.portfolio-reader__service-link:focus-visible .portfolio-reader__service-cta i {
  transform: translateX(3px);
}

/* Related blog posts on a single post --------------------------------- */
.single-post-related {
  margin: 3rem 0 0;
}
.single-post-related__header {
  margin-bottom: 1.5rem;
}
.single-post-related__eyebrow {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: rgba(0, 0, 0, 0.55);
  display: block;
  margin-bottom: 0.4rem;
}
.single-post-related__title {
  margin: 0;
  font-size: clamp(1.4rem, 2.4vw, 1.8rem);
}

.single-post-share {
  margin: 2rem 0 0;
}

/* Shared share toolbar (pw-share) ------------------------------------- */
.pw-share {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}
.pw-share__label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: rgba(0, 0, 0, 0.55);
  font-weight: 700;
}
.pw-share__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 0.45rem;
}
.pw-share__link {
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.04);
  border: 1px solid rgba(0, 0, 0, 0.08);
  color: #111;
  transition: background-color 220ms ease, border-color 220ms ease, color 220ms ease, transform 220ms ease;
  text-decoration: none;
}
.pw-share__link:hover, .pw-share__link:focus-visible {
  background: rgba(227, 190, 49, 0.18);
  border-color: rgba(227, 190, 49, 0.5);
  color: #0e0e0e;
  transform: translateY(-2px);
}

/* Dark-sidebar variant — share toolbar inside .right-sidebar / .single-post-sidebar */
.right-sidebar .pw-share .pw-share__label,
.single-post-sidebar .pw-share .pw-share__label,
.service-sidebar .pw-share .pw-share__label {
  color: rgba(255, 255, 255, 0.55);
}
.right-sidebar .pw-share .pw-share__link,
.single-post-sidebar .pw-share .pw-share__link,
.service-sidebar .pw-share .pw-share__link {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.09);
  color: rgba(255, 255, 255, 0.78);
  /* The sidebar nav rule (.right-sidebar ul li a::before) paints a
     small amber tick before every link. Suppress it here so the
     share icons aren't drawn with that leading line. */
}
.right-sidebar .pw-share .pw-share__link::before,
.single-post-sidebar .pw-share .pw-share__link::before,
.service-sidebar .pw-share .pw-share__link::before {
  content: none;
}
.right-sidebar .pw-share .pw-share__link:hover, .right-sidebar .pw-share .pw-share__link:focus-visible,
.single-post-sidebar .pw-share .pw-share__link:hover,
.single-post-sidebar .pw-share .pw-share__link:focus-visible,
.service-sidebar .pw-share .pw-share__link:hover,
.service-sidebar .pw-share .pw-share__link:focus-visible {
  background: rgba(227, 190, 49, 0.18);
  border-color: rgba(227, 190, 49, 0.55);
  color: rgb(227, 190, 49);
}

/* Table of contents (built by enhancements.js) ------------------------ */
.pw-toc__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.4rem;
  font-size: 0.92rem;
}
.pw-toc__item--h3 {
  padding-left: 1rem;
}
.pw-toc__item a {
  text-decoration: none;
  color: rgba(0, 0, 0, 0.7);
  border-left: 2px solid transparent;
  padding-left: 0.6rem;
  display: block;
  line-height: 1.4;
  transition: color 200ms ease, border-color 200ms ease, transform 200ms ease;
}
.pw-toc__item a:hover, .pw-toc__item a:focus-visible {
  color: #111;
  border-left-color: rgba(0, 0, 0, 0.4);
}
.pw-toc__item a.is-active {
  color: #111;
  border-left-color: #111;
  font-weight: 600;
  transform: translateX(2px);
}

/* Card reading-time chip ---------------------------------------------- */
.post-card__reading-time {
  color: rgba(0, 0, 0, 0.55);
  font-size: 0.88em;
}

/* =====================================================================
 * Sidebar cards (pw-sidebar-card)
 *
 * Used inside .right-sidebar and .single-post-sidebar — both dark/gold
 * gradient containers. Cards render as transparent panels with the
 * existing Cornish gold accent treatment, square corners, and white
 * type so they read as part of the parent sidebar instead of floating
 * cards. No border-radius anywhere.
 * ================================================================== */
.pw-sidebar-card {
  position: relative;
  padding: 1.45rem 1.45rem 1.55rem 1.85rem;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: #f5f5f5;
}
.pw-sidebar-card + .pw-sidebar-card, .pw-sidebar-card + .single-post-sidebar__panel, .single-post-sidebar__panel + .pw-sidebar-card {
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}
.pw-sidebar-card__eyebrow {
  display: inline-block;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: rgba(227, 190, 49, 0.7);
  margin: 0 0 0.55rem;
  font-weight: 700;
}
.pw-sidebar-card__title {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin: 0 0 1.15rem;
  font-size: clamp(1.05rem, 0.9rem + 0.75vw, 1.3rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #fff;
}
.pw-sidebar-card__title::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  min-width: 2.75rem;
  background: linear-gradient(90deg, rgba(227, 190, 49, 0.75), rgba(227, 190, 49, 0.08));
}
.pw-sidebar-card__copy {
  margin: 0 0 1rem;
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.92rem;
  line-height: 1.65;
}

/* Contact card -------------------------------------------------------- */
.pw-sidebar-card--contact .pw-sidebar-card__channels {
  list-style: none;
  margin: 0 0 1.1rem;
  padding: 0;
  display: grid;
  gap: 0.5rem;
}
.pw-sidebar-card--contact .pw-sidebar-card__channel {
  display: grid;
  grid-template-columns: 2.4rem 1fr;
  column-gap: 0.85rem;
  align-items: center;
  padding: 0.7rem 0.9rem;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 0;
  color: rgba(255, 255, 255, 0.84);
  text-decoration: none;
  transition: border-color 0.22s ease, background 0.22s ease, transform 0.22s ease;
}
.pw-sidebar-card--contact .pw-sidebar-card__channel i {
  grid-row: 1/span 2;
  width: 2.4rem;
  height: 2.4rem;
  background: rgba(227, 190, 49, 0.14);
  border: 1px solid rgba(227, 190, 49, 0.32);
  color: rgb(227, 190, 49);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
}
.pw-sidebar-card--contact .pw-sidebar-card__channel-label {
  font-size: 0.66rem;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: rgba(255, 255, 255, 0.5);
  font-weight: 700;
}
.pw-sidebar-card--contact .pw-sidebar-card__channel-value {
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.02em;
}
.pw-sidebar-card--contact .pw-sidebar-card__channel:hover, .pw-sidebar-card--contact .pw-sidebar-card__channel:focus-visible {
  border-color: rgba(227, 190, 49, 0.4);
  background: rgba(255, 255, 255, 0.06);
  transform: translateY(-1px);
  outline: none;
}
.pw-sidebar-card--contact .pw-sidebar-card__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  width: 100%;
  min-height: 46px;
  padding: 0.85rem 1.2rem;
  background: rgba(227, 190, 49, 0.14);
  border: 1px solid rgba(227, 190, 49, 0.34);
  border-radius: 0;
  color: #fff;
  text-decoration: none;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  transition: border-color 0.22s ease, background 0.22s ease, color 0.22s ease, transform 0.22s ease;
}
.pw-sidebar-card--contact .pw-sidebar-card__cta:hover, .pw-sidebar-card--contact .pw-sidebar-card__cta:focus-visible {
  outline: none;
  border-color: rgba(227, 190, 49, 0.72);
  background: rgba(227, 190, 49, 0.22);
  color: rgb(227, 190, 49);
  transform: translateY(-1px);
}
.pw-sidebar-card--contact .pw-sidebar-card__cta i {
  font-size: 0.7rem;
  transition: transform 0.22s ease;
}
.pw-sidebar-card--contact .pw-sidebar-card__cta:hover i, .pw-sidebar-card--contact .pw-sidebar-card__cta:focus-visible i {
  transform: translateX(3px);
}
.pw-sidebar-card--contact .pw-sidebar-card__hours {
  display: block;
  margin-top: 0.85rem;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: rgba(255, 255, 255, 0.45);
}

/* Author card --------------------------------------------------------- */
.pw-sidebar-card--author .pw-sidebar-card__author {
  display: grid;
  grid-template-columns: 60px 1fr;
  gap: 1rem;
  align-items: start;
}
.pw-sidebar-card--author .pw-sidebar-card__avatar {
  width: 60px;
  height: 60px;
  object-fit: cover;
  border-radius: 0;
  border: 1px solid rgba(227, 190, 49, 0.34);
}
.pw-sidebar-card--author .pw-sidebar-card__author-link {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-top: 0.4rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  text-decoration: none;
  color: rgb(227, 190, 49);
  transition: color 0.22s ease;
}
.pw-sidebar-card--author .pw-sidebar-card__author-link i {
  transition: transform 0.22s ease;
}
.pw-sidebar-card--author .pw-sidebar-card__author-link:hover, .pw-sidebar-card--author .pw-sidebar-card__author-link:focus-visible {
  color: #fff;
}
.pw-sidebar-card--author .pw-sidebar-card__author-link:hover i, .pw-sidebar-card--author .pw-sidebar-card__author-link:focus-visible i {
  transform: translateX(3px);
}

/* Compact mini-lists (case studies + services) ----------------------- */
.pw-sidebar-mini-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}
.pw-sidebar-mini-list__link {
  display: grid;
  grid-template-columns: 60px 1fr auto;
  align-items: center;
  column-gap: 0.85rem;
  padding: 0.65rem 0.75rem 0.65rem 0.65rem;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 0;
  text-decoration: none;
  color: rgba(255, 255, 255, 0.84);
  transition: border-color 0.22s ease, background 0.22s ease, transform 0.22s ease;
}
.pw-sidebar-mini-list__link--text {
  grid-template-columns: 1fr auto;
  padding-left: 0.9rem;
}
.pw-sidebar-mini-list__link:hover, .pw-sidebar-mini-list__link:focus-visible {
  border-color: rgba(227, 190, 49, 0.4);
  background: rgba(255, 255, 255, 0.05);
  transform: translateY(-1px);
  outline: none;
}
.pw-sidebar-mini-list__thumb-wrap {
  width: 60px;
  height: 60px;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.pw-sidebar-mini-list__thumb-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.pw-sidebar-mini-list__thumb-wrap--fallback {
  background: linear-gradient(135deg, rgba(227, 190, 49, 0.18), rgba(0, 0, 0, 0.3));
}
.pw-sidebar-mini-list__body {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.pw-sidebar-mini-list__title {
  font-weight: 700;
  color: #fff;
  line-height: 1.3;
  font-size: 0.95rem;
  letter-spacing: 0.01em;
}
.pw-sidebar-mini-list__meta {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: rgba(255, 255, 255, 0.48);
}
.pw-sidebar-mini-list__arrow {
  align-self: center;
  color: rgba(227, 190, 49, 0.55);
  transition: color 0.22s ease, transform 0.22s ease;
}
.pw-sidebar-mini-list__link:hover .pw-sidebar-mini-list__arrow, .pw-sidebar-mini-list__link:focus-visible .pw-sidebar-mini-list__arrow {
  color: rgb(227, 190, 49);
  transform: translateX(3px);
}

/* Sidebar TOC --------------------------------------------------------- */
.pw-sidebar-card--toc .pw-sidebar-toc {
  margin: 0;
}
.pw-sidebar-card--toc .pw-sidebar-toc__summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.4rem;
  position: relative;
}
.pw-sidebar-card--toc .pw-sidebar-toc__summary::-webkit-details-marker {
  display: none;
}
.pw-sidebar-card--toc .pw-sidebar-toc__summary .pw-sidebar-card__title {
  margin-bottom: 0;
}
.pw-sidebar-card--toc .pw-sidebar-toc__chevron {
  margin-left: auto;
  font-size: 0.7rem;
  transition: transform 0.22s ease;
  color: rgba(227, 190, 49, 0.7);
}
.pw-sidebar-card--toc details[open] .pw-sidebar-toc__chevron {
  transform: rotate(180deg);
}
.pw-sidebar-card--toc .pw-sidebar-toc__body {
  margin-top: 1rem;
}

/* TOC links built by enhancements.js — dark theme override ------------ */
.pw-sidebar-card--toc .pw-toc__list {
  gap: 0.2rem;
}

.pw-sidebar-card--toc .pw-toc__item a {
  color: rgba(255, 255, 255, 0.62);
  border-left: 2px solid rgba(255, 255, 255, 0.08);
  padding: 0.3rem 0 0.3rem 0.7rem;
}
.pw-sidebar-card--toc .pw-toc__item a:hover, .pw-sidebar-card--toc .pw-toc__item a:focus-visible {
  color: #fff;
  border-left-color: rgba(227, 190, 49, 0.7);
}
.pw-sidebar-card--toc .pw-toc__item a.is-active {
  color: rgb(227, 190, 49);
  border-left-color: rgb(227, 190, 49);
}

/* Disclosure panels in the dark sidebar -------------------------------
 * Used by:
 *   .single-post-sidebar__disclosure (single.php)
 *   .service-sidebar__section--services (page-templates/service.php)
 * ------------------------------------------------------------------- */
.single-post-sidebar__disclosure summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.8rem;
  position: relative;
  padding-right: 1.6rem;
}
.single-post-sidebar__disclosure summary::-webkit-details-marker {
  display: none;
}
.single-post-sidebar__disclosure .single-post-sidebar__eyebrow {
  flex: 1 0 100%;
  margin: 0 0 0.35rem;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: rgba(227, 190, 49, 0.7);
}
.single-post-sidebar__disclosure .single-post-sidebar__disclosure-title {
  flex: 1 1 auto;
  margin: 0;
  font-size: clamp(1rem, 0.9rem + 0.5vw, 1.2rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #fff;
}
.single-post-sidebar__disclosure .single-post-sidebar__disclosure-chevron {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.75rem;
  color: rgba(227, 190, 49, 0.7);
  transition: transform 0.22s ease;
}
.single-post-sidebar__disclosure[open] .single-post-sidebar__disclosure-chevron {
  transform: translateY(-50%) rotate(180deg);
}
.single-post-sidebar__disclosure {
  /* Body content gets a top divider and a touch of breathing room */
}
.single-post-sidebar__disclosure > *:not(summary) {
  margin-top: 1rem;
}

/* Service sidebar additions ----------------------------------------- */
.service-sidebar__cta-channels {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.5rem;
  font-size: 0.85rem;
}
.service-sidebar__cta-channels a {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: rgba(255, 255, 255, 0.78);
  text-decoration: none;
  padding: 0.4rem 0;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.service-sidebar__cta-channels a i {
  width: 1.2rem;
  color: rgba(227, 190, 49, 0.7);
  text-align: center;
}
.service-sidebar__cta-channels a:hover, .service-sidebar__cta-channels a:focus-visible {
  color: #fff;
}

.service-sidebar__highlights {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.6rem;
}
.service-sidebar__highlights li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.7rem;
  align-items: start;
  font-size: 0.95rem;
  color: rgba(255, 255, 255, 0.82);
  line-height: 1.5;
}
.service-sidebar__highlights i {
  margin-top: 0.25rem;
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 0;
  background: rgba(227, 190, 49, 0.14);
  border: 1px solid rgba(227, 190, 49, 0.32);
  color: rgb(227, 190, 49);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.6rem;
}

.service-sidebar__cta-button {
  border-radius: 0;
  background: rgba(227, 190, 49, 0.14);
  color: #fff;
  border: 1px solid rgba(227, 190, 49, 0.34);
  box-shadow: none;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.95rem 1.2rem;
  width: 100%;
  justify-content: center;
}
.service-sidebar__cta-button:hover, .service-sidebar__cta-button:focus-visible {
  border-color: rgba(227, 190, 49, 0.72);
  background: rgba(227, 190, 49, 0.22);
  color: rgb(227, 190, 49);
  box-shadow: none;
}

.service-sidebar__cta-copy {
  color: rgba(255, 255, 255, 0.62);
  margin: 0.6rem 0 1.1rem;
  font-size: 0.92rem;
  line-height: 1.65;
}

/* Single-post sidebar eyebrow tweak (matches new disclosures) --------- */
.single-post-sidebar__panel--related .single-post-sidebar__eyebrow,
.single-post-sidebar__panel .single-post-sidebar__eyebrow {
  display: block;
  margin-bottom: 0.3rem;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: rgba(227, 190, 49, 0.7);
}

/* Strip leftover sticky behaviour I added before — sidebars now flow */
.service-sidebar__section--sticky {
  position: relative;
  top: auto;
}

@media (min-width: 1024px) {
  .single-post-sidebar > .pw-sidebar-card:first-child,
  .right-sidebar > .pw-sidebar-card:first-child {
    position: relative;
    top: auto;
  }
}
/*!
Theme Name: Prenn Woodcraft
Theme URI: https://prennwoodcraft.co.uk/
Author: Nathan Svensson
Author URI: http://underscores.me/
Description: WordPress theme for Prenn Woodcraft — heritage carpentry in Devon and Cornwall.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: prenn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Prenn Woodcraft is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* ==========================================================================
   Ninja Forms — generic light-background styles
   .contact-form overrides these for the dark CTA panel (higher specificity).
   ========================================================================== */
.nf-form-fields-required, .nf-form-title {
  display: none;
}

.nf-form-cont .nf-form-content {
  padding-left: 0;
  padding-right: 0;
}
.nf-form-cont .nf-field-container {
  margin-bottom: 1.25rem;
}
.nf-form-cont .nf-field-label label,
.nf-form-cont label {
  display: block;
  font-size: 0.85rem;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 0.35rem;
}
.nf-form-cont .ninja-forms-req-symbol {
  color: rgb(227, 190, 49);
  margin-left: 0.2rem;
}
.nf-form-cont input:not([type=submit]):not([type=radio]):not([type=checkbox]):not([type=hidden]),
.nf-form-cont select {
  width: 100%;
  min-height: 3.5rem;
  padding: 0.95rem 1rem;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 0.88rem;
  border: 1px solid rgba(0, 0, 0, 0.14);
  border-radius: 0;
  color: #2d2d2d;
  box-shadow: 0 12px 24px rgba(14, 14, 14, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.72);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(247, 244, 235, 0.96)), linear-gradient(125deg, rgba(227, 190, 49, 0.12), transparent 42%, rgba(22, 47, 58, 0.06) 100%);
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease, background 0.22s ease;
  -webkit-appearance: none;
  appearance: none;
}
.nf-form-cont input:not([type=submit]):not([type=radio]):not([type=checkbox]):not([type=hidden])::placeholder,
.nf-form-cont select::placeholder {
  color: rgba(0, 0, 0, 0.22);
}
.nf-form-cont input:not([type=submit]):not([type=radio]):not([type=checkbox]):not([type=hidden]):hover,
.nf-form-cont select:hover {
  transform: translateY(-1px);
  border-color: rgba(22, 47, 58, 0.24);
  box-shadow: 0 16px 30px rgba(14, 14, 14, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.72);
}
.nf-form-cont input:not([type=submit]):not([type=radio]):not([type=checkbox]):not([type=hidden]):focus,
.nf-form-cont select:focus {
  outline: none;
  border-color: rgba(227, 190, 49, 0.82);
  box-shadow: 0 0 0 3px rgba(227, 190, 49, 0.14), 0 16px 30px rgba(14, 14, 14, 0.12);
}
.nf-form-cont {
  /* Selects should feel like the radio cards, not stock browser chrome. */
}
.nf-form-cont select {
  min-height: 3.5rem;
  padding: 0.95rem 3.9rem 0.95rem 1rem;
  border: 1px solid rgba(0, 0, 0, 0.14);
  border-radius: 0;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(247, 244, 235, 0.96)), linear-gradient(125deg, rgba(227, 190, 49, 0.12), transparent 42%, rgba(22, 47, 58, 0.06) 100%);
  box-shadow: 0 12px 24px rgba(14, 14, 14, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.72);
  font-weight: 700;
  line-height: 1.25;
  cursor: pointer;
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease, background 0.22s ease;
  background-image: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(247, 244, 235, 0.96)), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='10' viewBox='0 0 14 10'%3E%3Cpath d='M2 2.25 7 7.25l5-5' fill='none' stroke='%23162f3a' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat;
  background-position: 0 0, right 1.15rem center;
  background-size: auto, 0.95rem;
}
.nf-form-cont select:hover {
  transform: translateY(-1px);
  border-color: rgba(22, 47, 58, 0.24);
  box-shadow: 0 16px 30px rgba(14, 14, 14, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.72);
}
.nf-form-cont select:focus {
  border-color: rgba(227, 190, 49, 0.82);
  box-shadow: 0 0 0 3px rgba(227, 190, 49, 0.14), 0 16px 30px rgba(14, 14, 14, 0.12);
}
.nf-form-cont .list-select-wrap .nf-field-element,
.nf-form-cont .listselect-wrap .nf-field-element,
.nf-form-cont .listcountry-wrap .nf-field-element,
.nf-form-cont .liststate-wrap .nf-field-element {
  position: relative;
}
.nf-form-cont .list-select-wrap .nf-field-element select,
.nf-form-cont .listselect-wrap .nf-field-element select,
.nf-form-cont .listcountry-wrap .nf-field-element select,
.nf-form-cont .liststate-wrap .nf-field-element select {
  padding-right: 3.9rem;
}
.nf-form-cont .list-select-wrap .nf-field-element:hover select,
.nf-form-cont .listselect-wrap .nf-field-element:hover select,
.nf-form-cont .listcountry-wrap .nf-field-element:hover select,
.nf-form-cont .liststate-wrap .nf-field-element:hover select {
  transform: translateY(-1px);
  border-color: rgba(22, 47, 58, 0.24);
  box-shadow: 0 16px 30px rgba(14, 14, 14, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.72);
}
.nf-form-cont .list-select-wrap .nf-field-element:focus-within select,
.nf-form-cont .listselect-wrap .nf-field-element:focus-within select,
.nf-form-cont .listcountry-wrap .nf-field-element:focus-within select,
.nf-form-cont .liststate-wrap .nf-field-element:focus-within select {
  border-color: rgba(227, 190, 49, 0.82);
  box-shadow: 0 0 0 3px rgba(227, 190, 49, 0.14), 0 16px 30px rgba(14, 14, 14, 0.12);
}
.nf-form-cont textarea {
  width: 100%;
  resize: vertical;
  min-height: 100px;
  padding: 1rem;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 0.88rem;
  border: 1px solid rgba(0, 0, 0, 0.14);
  border-radius: 0;
  color: #2d2d2d;
  box-shadow: 0 12px 24px rgba(14, 14, 14, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.72);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(247, 244, 235, 0.96)), linear-gradient(125deg, rgba(227, 190, 49, 0.12), transparent 42%, rgba(22, 47, 58, 0.06) 100%);
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease, background 0.22s ease;
  -webkit-appearance: none;
  appearance: none;
}
.nf-form-cont textarea::placeholder {
  color: rgba(0, 0, 0, 0.22);
}
.nf-form-cont textarea:hover {
  transform: translateY(-1px);
  border-color: rgba(22, 47, 58, 0.24);
  box-shadow: 0 16px 30px rgba(14, 14, 14, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.72);
}
.nf-form-cont textarea:focus {
  outline: none;
  border-color: rgba(227, 190, 49, 0.82);
  box-shadow: 0 0 0 3px rgba(227, 190, 49, 0.14), 0 16px 30px rgba(14, 14, 14, 0.12);
}
.nf-form-cont {
  /* Radio groups become selectable cards instead of raw browser controls. */
}
.nf-form-cont .listradio-wrap .nf-field-element ul,
.nf-form-cont .list-radio-wrap .nf-field-element ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.85rem;
}
.nf-form-cont .listradio-wrap .nf-field-element li,
.nf-form-cont .list-radio-wrap .nf-field-element li {
  position: relative;
  margin: 0;
}
.nf-form-cont .listradio-wrap .nf-field-element input[type=radio],
.nf-form-cont .list-radio-wrap .nf-field-element input[type=radio] {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0.001;
  cursor: pointer;
  z-index: 2;
}
.nf-form-cont .listradio-wrap .nf-field-element label,
.nf-form-cont .list-radio-wrap .nf-field-element label {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 4.5rem;
  padding: 1rem;
  margin: 0;
  border: 1px solid rgba(0, 0, 0, 0.14);
  border-radius: 1.2rem 0.4rem 1.2rem 0.4rem;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(247, 244, 235, 0.96));
  box-shadow: 0 12px 24px rgba(14, 14, 14, 0.08);
  color: #2d2d2d;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.35;
  text-transform: none;
  letter-spacing: 0.02em;
  cursor: pointer;
  overflow: hidden;
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease, background 0.22s ease, color 0.22s ease;
}
.nf-form-cont .listradio-wrap .nf-field-element label::after,
.nf-form-cont .list-radio-wrap .nf-field-element label::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(125deg, rgba(227, 190, 49, 0.14), transparent 42%, rgba(22, 47, 58, 0.08) 100%);
  opacity: 0.9;
  pointer-events: none;
  transition: opacity 0.22s ease;
}
.nf-form-cont .listradio-wrap .nf-field-element li:hover label,
.nf-form-cont .list-radio-wrap .nf-field-element li:hover label {
  transform: translateY(-2px);
  border-color: rgba(22, 47, 58, 0.24);
  box-shadow: 0 16px 30px rgba(14, 14, 14, 0.12);
}
.nf-form-cont .listradio-wrap .nf-field-element input[type=radio]:focus-visible + label,
.nf-form-cont .list-radio-wrap .nf-field-element input[type=radio]:focus-visible + label {
  border-color: rgba(227, 190, 49, 0.85);
  box-shadow: 0 0 0 3px rgba(227, 190, 49, 0.18), 0 16px 30px rgba(14, 14, 14, 0.12);
  outline: none;
}
.nf-form-cont .listradio-wrap .nf-field-element input[type=radio]:checked + label,
.nf-form-cont .listradio-wrap .nf-field-element label.nf-checked-label,
.nf-form-cont .list-radio-wrap .nf-field-element input[type=radio]:checked + label,
.nf-form-cont .list-radio-wrap .nf-field-element label.nf-checked-label {
  background: linear-gradient(145deg, rgba(22, 47, 58, 0.96), rgba(13, 28, 34, 0.98));
  border-color: rgba(227, 190, 49, 0.9);
  box-shadow: 0 18px 34px rgba(22, 47, 58, 0.22);
  color: #fff;
}
.nf-form-cont .listradio-wrap .nf-field-element input[type=radio]:checked + label::after,
.nf-form-cont .listradio-wrap .nf-field-element label.nf-checked-label::after,
.nf-form-cont .list-radio-wrap .nf-field-element input[type=radio]:checked + label::after,
.nf-form-cont .list-radio-wrap .nf-field-element label.nf-checked-label::after {
  background: linear-gradient(125deg, rgba(227, 190, 49, 0.34), transparent 48%), linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
  opacity: 1;
}
.nf-form-cont {
  /* Checkbox groups mirror the radio-card treatment, but with a ticked square. */
}
.nf-form-cont .checkbox-wrap .nf-field-element ul,
.nf-form-cont .list-checkbox-wrap .nf-field-element ul,
.nf-form-cont .listcheckbox-wrap .nf-field-element ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.85rem;
}
.nf-form-cont .checkbox-wrap .nf-field-element,
.nf-form-cont .checkbox-wrap .nf-field-element li,
.nf-form-cont .list-checkbox-wrap .nf-field-element,
.nf-form-cont .list-checkbox-wrap .nf-field-element li,
.nf-form-cont .listcheckbox-wrap .nf-field-element,
.nf-form-cont .listcheckbox-wrap .nf-field-element li {
  position: relative;
  margin: 0;
}
.nf-form-cont .checkbox-wrap .nf-field-element input[type=checkbox],
.nf-form-cont .list-checkbox-wrap .nf-field-element input[type=checkbox],
.nf-form-cont .listcheckbox-wrap .nf-field-element input[type=checkbox] {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0.001;
  cursor: pointer;
  z-index: 2;
}
.nf-form-cont .checkbox-wrap .nf-field-element label,
.nf-form-cont .list-checkbox-wrap .nf-field-element label,
.nf-form-cont .listcheckbox-wrap .nf-field-element label {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 4.5rem;
  padding: 1rem 1rem 1rem 3.25rem;
  margin: 0;
  border: 1px solid rgba(0, 0, 0, 0.14);
  border-radius: 1.2rem 0.4rem 1.2rem 0.4rem;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(247, 244, 235, 0.96));
  box-shadow: 0 12px 24px rgba(14, 14, 14, 0.08);
  color: #2d2d2d;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.35;
  text-transform: none;
  letter-spacing: 0.02em;
  cursor: pointer;
  overflow: hidden;
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease, background 0.22s ease, color 0.22s ease;
}
.nf-form-cont .checkbox-wrap .nf-field-element label::before,
.nf-form-cont .list-checkbox-wrap .nf-field-element label::before,
.nf-form-cont .listcheckbox-wrap .nf-field-element label::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 1rem;
  width: 1.05rem;
  height: 1.05rem;
  border: 2px solid rgba(22, 47, 58, 0.45);
  border-radius: 0.3rem;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 0 0 0.25rem rgba(22, 47, 58, 0.08);
  transform: translateY(-50%) rotate(-3deg);
  transition: border-color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease;
}
.nf-form-cont .checkbox-wrap .nf-field-element label::after,
.nf-form-cont .list-checkbox-wrap .nf-field-element label::after,
.nf-form-cont .listcheckbox-wrap .nf-field-element label::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(125deg, rgba(227, 190, 49, 0.14), transparent 42%, rgba(22, 47, 58, 0.08) 100%);
  opacity: 0.9;
  pointer-events: none;
  transition: opacity 0.22s ease;
}
.nf-form-cont .checkbox-wrap .nf-field-element:hover label,
.nf-form-cont .list-checkbox-wrap .nf-field-element:hover label,
.nf-form-cont .listcheckbox-wrap .nf-field-element:hover label {
  transform: translateY(-2px);
  border-color: rgba(22, 47, 58, 0.24);
  box-shadow: 0 16px 30px rgba(14, 14, 14, 0.12);
}
.nf-form-cont .checkbox-wrap .nf-field-element input[type=checkbox]:focus-visible + label,
.nf-form-cont .list-checkbox-wrap .nf-field-element input[type=checkbox]:focus-visible + label,
.nf-form-cont .listcheckbox-wrap .nf-field-element input[type=checkbox]:focus-visible + label {
  border-color: rgba(227, 190, 49, 0.85);
  box-shadow: 0 0 0 3px rgba(227, 190, 49, 0.18), 0 16px 30px rgba(14, 14, 14, 0.12);
  outline: none;
}
.nf-form-cont .checkbox-wrap .nf-field-element input[type=checkbox]:checked + label,
.nf-form-cont .checkbox-wrap .nf-field-element label.nf-checked-label,
.nf-form-cont .list-checkbox-wrap .nf-field-element input[type=checkbox]:checked + label,
.nf-form-cont .list-checkbox-wrap .nf-field-element label.nf-checked-label,
.nf-form-cont .listcheckbox-wrap .nf-field-element input[type=checkbox]:checked + label,
.nf-form-cont .listcheckbox-wrap .nf-field-element label.nf-checked-label {
  background: linear-gradient(145deg, rgba(22, 47, 58, 0.96), rgba(13, 28, 34, 0.98));
  border-color: rgba(227, 190, 49, 0.9);
  box-shadow: 0 18px 34px rgba(22, 47, 58, 0.22);
  color: #fff;
}
.nf-form-cont .checkbox-wrap .nf-field-element input[type=checkbox]:checked + label::before,
.nf-form-cont .checkbox-wrap .nf-field-element label.nf-checked-label::before,
.nf-form-cont .list-checkbox-wrap .nf-field-element input[type=checkbox]:checked + label::before,
.nf-form-cont .list-checkbox-wrap .nf-field-element label.nf-checked-label::before,
.nf-form-cont .listcheckbox-wrap .nf-field-element input[type=checkbox]:checked + label::before,
.nf-form-cont .listcheckbox-wrap .nf-field-element label.nf-checked-label::before {
  border-color: rgb(227, 190, 49);
  background: linear-gradient(145deg, rgba(227, 190, 49, 0.98), rgba(206, 168, 32, 0.96)), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath d='M1.5 5 4.5 8 10.5 1.75' fill='none' stroke='%230f0f0f' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat;
  background-position: 0 0, center;
  background-size: auto, 0.65rem;
  box-shadow: 0 0 0 0.3rem rgba(227, 190, 49, 0.16);
  transform: translateY(-50%) rotate(0deg);
}
.nf-form-cont .checkbox-wrap .nf-field-element input[type=checkbox]:checked + label::after,
.nf-form-cont .checkbox-wrap .nf-field-element label.nf-checked-label::after,
.nf-form-cont .list-checkbox-wrap .nf-field-element input[type=checkbox]:checked + label::after,
.nf-form-cont .list-checkbox-wrap .nf-field-element label.nf-checked-label::after,
.nf-form-cont .listcheckbox-wrap .nf-field-element input[type=checkbox]:checked + label::after,
.nf-form-cont .listcheckbox-wrap .nf-field-element label.nf-checked-label::after {
  background: linear-gradient(125deg, rgba(227, 190, 49, 0.34), transparent 48%), linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
  opacity: 1;
}
.nf-form-cont .nf-error input:not([type=submit]):not([type=radio]):not([type=checkbox]):not([type=hidden]),
.nf-form-cont .nf-error select {
  border-color: #e05a5a;
  box-shadow: 0 0 0 3px rgba(224, 90, 90, 0.12);
}
.nf-form-cont .nf-error .list-select-wrap .nf-field-element select,
.nf-form-cont .nf-error .listselect-wrap .nf-field-element select,
.nf-form-cont .nf-error .listcountry-wrap .nf-field-element select,
.nf-form-cont .nf-error .liststate-wrap .nf-field-element select {
  border-color: #e05a5a;
  box-shadow: 0 0 0 3px rgba(224, 90, 90, 0.12);
}
.nf-form-cont .nf-error textarea {
  border-color: #e05a5a;
}
.nf-form-cont .nf-error-wrap {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.3rem;
}
.nf-form-cont .nf-error-wrap::before {
  content: "×";
  display: none;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  font-size: 0.75rem;
  font-weight: 700;
  color: #e05a5a;
  border: 1px solid rgba(224, 90, 90, 0.45);
  border-radius: 50%;
  flex-shrink: 0;
}
.nf-form-cont .nf-error-msg {
  position: static;
  display: none;
  font-size: 0.65rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #e05a5a;
  margin-top: 0.25rem;
}
.nf-form-cont .nf-response-msg {
  margin: 0 0 1.25rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(227, 190, 49, 0.34);
  border-left: 3px solid rgb(227, 190, 49);
  border-radius: 1.1rem 0.4rem 1.1rem 0.4rem;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(247, 244, 235, 0.96)), linear-gradient(125deg, rgba(227, 190, 49, 0.12), transparent 48%, rgba(22, 47, 58, 0.05) 100%);
  box-shadow: 0 14px 28px rgba(14, 14, 14, 0.08);
  color: #2d2d2d;
  font-size: 0.92rem;
  line-height: 1.6;
}
.nf-form-cont .nf-response-msg > * {
  margin: 0;
}
.nf-form-cont .nf-response-msg > * + * {
  margin-top: 0.55rem;
}
.nf-form-cont .nf-response-msg a {
  color: #0e0e0e;
  font-weight: 700;
  text-decoration-color: rgba(227, 190, 49, 0.6);
}
.nf-form-cont input[type=submit] {
  display: inline-block;
  min-height: 3.4rem;
  padding: 0.8rem 2rem;
  font-family: "Averia Serif Libre", Georgia, "Times New Roman", serif;
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.8px;
  border-radius: 0;
  cursor: pointer;
  background: rgb(227, 190, 49);
  color: #0e0e0e;
  border: 1px solid rgba(227, 190, 49, 0.9);
  box-shadow: 0 16px 30px rgba(22, 47, 58, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.26);
  transition: transform 0.22s ease, background 0.22s ease, color 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
  margin-top: 0.5rem;
}
.nf-form-cont input[type=submit]:hover {
  transform: translateY(-2px);
  background: rgb(22, 47, 58);
  color: rgb(227, 190, 49);
  border-color: rgba(227, 190, 49, 0.82);
  box-shadow: 0 20px 36px rgba(22, 47, 58, 0.22);
}
.nf-form-cont input[type=submit]:active {
  transform: translateY(0);
}

.nf-error-wrap {
  display: none;
}

/*# sourceMappingURL=style.css.map */
