/* ============================================================
   templatestyle.css — template16 Modern Responsive Redesign
   ============================================================ */

/* ============================================================
   CSS VARIABLES (Design Tokens)
   ============================================================ */
/*:root {
    
    
	--primary:       #2F5D50;
	--primary-dark:  #1e3d35;
	--primary-mid:   #3d7a68;
	--accent:        #B08D57; 
	--accent-light:  #d4b88a;

	
    --primary:       #6B3F16;
    --primary-dark:  #361f06;
    --primary-mid:   #472704;
    --accent:        #38691a;
    --accent-light:  #9ab72d;
	--bg-body:       #F7F3EA;
	--bg-page:       #ffffff;
	--bg-sidebar:    #f4f0e6;
	--bg-card:       #ffffff;
	--bg-card-hover: #fafaf7;
	--border-light:  #ede7d9;
	--border-mid:    #ddd4c7;
	--text-main:     #2B2B2B;
	--text-muted:    #555555;
	--text-light:    #888888;
	--shadow-sm:     0 2px 8px rgba(0,0,0,0.07);
	--shadow-md:     0 4px 20px rgba(0,0,0,0.12);
	--shadow-lg:     0 8px 32px rgba(0,0,0,0.15);
	--radius-sm:     8px;
	--radius-md:     12px;
	--radius-lg:     16px;
	--transition:    0.2s ease;
}	*/
:root{

    /* Brand Colors (Client Updated) */
    --primary:       #6B3F16; /* Header */
    --primary-dark:  #4A2A0F; /* Menu */
    --primary-mid:   #5a3412; /* optional mid shade */

    --accent:        #B58A4A;
    --accent-light:  #d2b07a; /* lighter accent variation */

    /* Backgrounds */
    --bg-body:       #F7F1E8;
    --bg-page:       #ffffff;
    --bg-sidebar:    #f3ede3;
    --bg-card:       #ffffff;
    --bg-card-hover: #faf7f2;

    /* Borders */
    --border-light:  #ece3d6;
    --border-mid:    #d8ccbc;

    /* Text */
    --text-main:     #2F241B;
    --text-muted:    #5c5146;
    --text-light:    #8a8076;

    /* Effects */
    --shadow-sm:     0 2px 8px rgba(0,0,0,0.07);
    --shadow-md:     0 4px 20px rgba(0,0,0,0.12);
    --shadow-lg:     0 8px 32px rgba(0,0,0,0.15);

    --radius-sm:     8px;
    --radius-md:     12px;
    --radius-lg:     16px;

    --transition:    0.2s ease;
}


/* ============================================================
   FONTS
   ============================================================ */
@font-face {
  font-family: 'Rochester';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/rochester-v18-latin-regular.eot');
  src: local(''),
       url('../fonts/rochester-v18-latin-regular.eot?#iefix') format('embedded-opentype'),
       url('../fonts/rochester-v18-latin-regular.woff2') format('woff2'),
       url('../fonts/rochester-v18-latin-regular.woff') format('woff'),
       url('../fonts/rochester-v18-latin-regular.ttf') format('truetype'),
       url('../fonts/rochester-v18-latin-regular.svg#Rochester') format('svg');
}
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/quicksand-v30-latin-regular.eot');
  src: local(''),
       url('../fonts/quicksand-v30-latin-regular.eot?#iefix') format('embedded-opentype'),
       url('../fonts/quicksand-v30-latin-regular.woff2') format('woff2'),
       url('../fonts/quicksand-v30-latin-regular.woff') format('woff'),
       url('../fonts/quicksand-v30-latin-regular.ttf') format('truetype'),
       url('../fonts/quicksand-v30-latin-regular.svg#Quicksand') format('svg');
}

#thomebody h2, #tsidebar h3, #tmenu, h1,
.plainheader, .adminsubhead, .admintotal,
.vmenu li, .tblock h2 {
	font-family: 'Quicksand', sans-serif;
}

#thomemast h1, #tmast h1 {
	font-family: 'Rochester', cursive;
	margin: 0;
}

#tmainbody{
    width: 100%;
}

.searchform #tmainbody{
    width: 100%;
}

.searchsidebar{
    position: relative;
}

.header-title{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.header-title span{
    font-size:1rem;
    color: #fff;
}

/* ============================================================
   RESET & BASE
   ============================================================ */

body {
	background-color: var(--bg-body);
	color: var(--text-main);
	margin: 0;
	padding: 0;
	font-family: 'Quicksand', sans-serif;
	font-size: 14px;
	line-height: 1.6;
}

.body {
	padding-top: 20px;
	width: 100%;
}

.header {
	display: none;
}

/* ============================================================
   LINKS
   ============================================================ */
a:link, a:active, div.icons a, .plainheader,
#thomemast h1, #tmast h1,
#tsidebar h3, #thomebody h2 {
	color: var(--primary);
}

a:visited {
	color: #336666;
}

a:hover {
	color: var(--accent);
	text-decoration: none;
}

a.snlink:hover, .snlinkact, .adminnav .snlinkact,
.LB_closeAjaxWindow, .sideback, .fieldnameback,
.tablesaw-cell-label, .bar {
	background-color: var(--primary);
}

.databack, .snlink,
ul.tngdd .langmenu, ul.tngdd .stubmenu,
.LB_window, .reportcol li:hover {
	background-color: var(--border-mid);
}

label.formfield {
	color: var(--text-muted);
}

/* ============================================================
   PAGE WRAPPER
   ============================================================ */
#tcontainer {
	min-height: 100vh;
	padding: 24px 0 40px;
}

#tpage {
	width: 84%;
	max-width: 1280px;
	display: block;
	margin: 0 auto;
	background-color: var(--bg-page);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-lg);
	overflow: hidden;
	padding: 0;
}

/* ============================================================
   HEADER — Dark gradient with logo + title
   ============================================================ */
#tmastheader,
.theader {
	background: linear-gradient(
		90deg,
		var(--primary),
		var(--primary-dark)
	);
	border-radius: 0;
	text-align: left;
}

.theader{
    background: var(--primary-dark);
}

#thomemast,
#tmast {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 24px 36px 16px;

}

.mast {
	padding: 0;
}

/* Logo */
#t16-logo {
	width: 120px;
	object-fit: contain;
	flex-shrink: 0;

	transition: opacity var(--transition);
}

#t16-logo:hover {
	opacity: 0.88;
}

/* Site Title */
#thomemast h1,
#tmast h1 {
	color: #ffffff !important;
	font-size: 36pt;
	line-height: 1.1;
	text-shadow: 0 2px 10px rgba(0,0,0,0.35);
	letter-spacing: 1px;
	margin: 0;
}

/* ============================================================
   NAVIGATION BAR — #tmenu
   ============================================================ */
#tmenu {
	background-color: rgba(0, 0, 0, 0.28);
	margin: 0;
	padding: 0 28px;
	border-top: 1px solid rgba(255,255,255,0.10);
	border-bottom: none;
}

#tmenu ul {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin: 0;
	padding: 0;
	overflow: visible;
	    justify-content: center;
}

#tmenu ul li {
	float: none;
	line-height: 1;
	font-size: 11pt;
	font-family: 'Quicksand', sans-serif;
}

#tmenu ul li a {
	display: block;
	color: rgba(255,255,255,0.85);
	text-decoration: none;
	padding: 13px 20px;
	font-weight: 600;
	letter-spacing: 0.4px;
	border-bottom: 3px solid transparent;
	border-top: 3px solid transparent;
	transition: color var(--transition), border-color var(--transition), background-color var(--transition);
}

#tmenu ul li a:hover {
	color: #ffffff;
	border-bottom: 3px solid var(--accent);
	background-color: rgba(255,255,255,0.07);
	text-decoration: none;
}

/* Button hover override to match client color */



.contact-btn:hover,
.policy-link-btn:hover,
#tmenu ul li a:hover {
	background-color: #6E7F5B !important;
}

/* ============================================================
   TNG ICONS BAR — .menucontainer / .innercontainer
   The bar output by tng_icons() containing Find/Media/Info
   dropdowns + left & right icon links
   ============================================================ */

/* Outer wrapper */
div.menucontainer {
	    background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 100%);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    margin: 0;
    padding: 0;
    border-radius: 10px;
    margin-bottom: 10px;
}

/* Inner container — override the old border + background */
div.innercontainer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 4px 20px;
	background: transparent;
	border-bottom: none;
	min-height: 42px;
	flex-wrap: wrap;
	gap: 4px;
}

/* ---- Left icons ---- */
div.icons {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

div.icons a,
div.icons a:link,
div.icons a:visited {
	display: inline-flex;
	align-items: center;
	color: rgba(255,255,255,0.85) !important;
	text-decoration: none;
	padding: 5px 8px;
	border-radius: var(--radius-sm);
	font-family: 'Quicksand', sans-serif;
	font-size: 10pt;
	font-weight: 600;
	transition: background-color var(--transition), color var(--transition);
}

div.icons a:hover {
	color: #ffffff !important;
	background-color: rgba(255,255,255,0.12);
	text-decoration: none;
}

div.icons img {
	filter: brightness(0) invert(1);
	opacity: 0.85;
	transition: opacity var(--transition);
}

div.icons a:hover img {
	opacity: 1;
}

/* ---- Right icons ---- */
div.icons-rt.in-bar {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

div.icons-rt.in-bar a,
div.icons-rt.in-bar a:link,
div.icons-rt.in-bar a:visited {
	display: inline-flex;
	align-items: center;
	color: rgba(255,255,255,0.85) !important;
	text-decoration: none;
	padding: 5px 8px;
	border-radius: var(--radius-sm);
	font-family: 'Quicksand', sans-serif;
	font-size: 10pt;
	font-weight: 600;
	transition: background-color var(--transition), color var(--transition);
}

div.icons-rt.in-bar a:hover {
	color: #ffffff !important;
	background-color: rgba(255,255,255,0.12);
	text-decoration: none;
}

div.icons-rt.in-bar img {
	filter: brightness(0) invert(1);
	opacity: 0.85;
	transition: opacity var(--transition);
}

div.icons-rt.in-bar a:hover img {
	opacity: 1;
}

/* ============================================================
   TNG DROPDOWN MENU — ul.tngdd (Find / Media / Info)
   ============================================================ */

/* Top-level list */
ul.tngdd {
	display: inline-flex;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 2px;
}

ul.tngdd > li {
	position: relative;
}

/* Dropdown trigger button */
ul.tngdd .menulink,
ul.tngdd .menulink:link,
ul.tngdd .menulink:visited {
	display: inline-flex;
	align-items: center;
	color: rgba(255,255,255,0.88) !important;
	background: transparent url(../img/ArrowDown.gif) right 10px center no-repeat !important;
	background-size: 10px auto !important;
	padding: 7px 28px 7px 14px;
	border-radius: var(--radius-sm);
	font-family: 'Quicksand', sans-serif;
	font-size: 10.5pt;
	font-weight: 600;
	letter-spacing: 0.3px;
	text-decoration: none;
	border-bottom-color: transparent !important;
	border-right-color: transparent !important;
	transition: background-color var(--transition), color var(--transition);
	cursor: pointer;
}

ul.tngdd .menulink:hover,
ul.tngdd .menuhover {
	color: #ffffff !important;
	background-color: rgba(255,255,255,0.13) !important;
	background-image: url(../img/arrowdown2.gif) !important;
	background-position: right 10px center !important;
	background-repeat: no-repeat !important;
	background-size: 10px auto !important;
	border-radius: var(--radius-sm);
	text-decoration: none;
}

/* Hide ALL sub-menus by default */
ul.tngdd ul {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 9999;
	background-color: var(--primary-dark);
	border: 1px solid rgba(255,255,255,0.12);
	border-radius: 0 var(--radius-sm) var(--radius-sm) var(--radius-sm);
	box-shadow: var(--shadow-md);
	min-width: 200px;
	padding: 4px 0;
	list-style: none;
	margin: 0;
	display: none !important;
}
ul.tngdd > li:has(> .menuhover) > ul {
	display: block !important;
}

ul.tngdd ul li a,
ul.tngdd ul li a:link,
ul.tngdd ul li a:visited {
	display: block;
	color: rgba(255,255,255,0.82) !important;
	background-color: transparent !important;
	padding: 8px 18px;
	font-family: 'Quicksand', sans-serif;
	font-size: 10.5pt;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color var(--transition), color var(--transition), padding-left var(--transition);
}

ul.tngdd ul li a:hover {
	background-color: rgba(255,255,255,0.10) !important;
	color: var(--accent-light) !important;
	padding-left: 24px;
	text-decoration: none;
}

/* Separator line in dropdown */
ul.tngdd .topline {
	border-top: 1px solid rgba(255,255,255,0.14);
	margin: 4px 0;
}

/* Sub-arrow indicator */
ul.tngdd .sub {
	background: var(--primary-dark) url(../img/arrow.gif) right 10px center no-repeat;
}

/* Language / stub sub-menus */
ul.tngdd .langmenu,
ul.tngdd .stubmenu {
	background-color: var(--primary-dark) !important;
	border-color: rgba(255,255,255,0.12);
}

/* ============================================================
   SEARCH SLIDEDOWN — #searchdrop
   ============================================================ */
#searchdrop.slidedown {
	background-color: var(--bg-sidebar);
	border: 1px solid var(--border-light);
	border-top: 3px solid var(--primary);
	border-radius: 0 0 var(--radius-md) var(--radius-md);
	padding: 16px 20px 14px;
	box-shadow: var(--shadow-md);
	margin: 0;
}

#searchdrop .subhead {
	font-family: 'Quicksand', sans-serif;
	font-size: 10.5pt;
	font-weight: 700;
	color: var(--primary);
}

#searchdrop .subhead a,
#searchdrop .subhead a:link,
#searchdrop .subhead a:visited {
	color: var(--primary);
	text-decoration: none;
	font-weight: 600;
	transition: color var(--transition);
}

#searchdrop .subhead a:hover {
	color: var(--accent);
	text-decoration: underline;
}

.contact-card input,.contact-card select,.contact-card textarea{
    box-shadow: none;
}

#searchdrop input[type="text"] {
	border: 1px solid var(--border-mid);
	border-radius: var(--radius-sm);
	padding: 5px 8px;
	font-family: 'Quicksand', sans-serif;
	font-size: 10.5pt;
	color: var(--text-main);
	background: #fff;
	transition: border-color var(--transition);
}

#searchdrop input[type="text"]:focus {
	outline: none;
	border-color: var(--accent);
	box-shadow: 0 0 0 2px rgba(91,188,214,0.20);
}

#searchdrop input[type="submit"].btn {
	background-color: var(--primary);
	color: #ffffff;
	border: none;
	border-radius: var(--radius-sm);
	padding: 6px 18px;
	font-family: 'Quicksand', sans-serif;
	font-size: 10.5pt;
	font-weight: 700;
	cursor: pointer;
	transition: background-color var(--transition);
}

#searchdrop input[type="submit"].btn:hover {
	background-color: var(--primary-mid);
}

#searchdrop a[onclick] img {
	opacity: 0.55;
	transition: opacity var(--transition);
}

#searchdrop a[onclick]:hover img {
	opacity: 1;
}

/* ============================================================
   SHARE ICONS — #shareicons
   ============================================================ */
#shareicons {
	background-color: var(--bg-sidebar);
	border: 1px solid var(--border-light);
	border-top: 3px solid var(--primary);
	border-radius: 0 0 var(--radius-md) var(--radius-md);
	padding: 12px 16px;
	box-shadow: var(--shadow-md);
}

/* ============================================================
   BODY LAYOUT — sidebar + main content
   ============================================================ */
#tbody {
	display: flex;
	align-items: flex-start;
	gap: 28px;
	padding: 28px 32px 28px;
	justify-content: center;
}

/* ============================================================
   LEFT SIDEBAR
   ============================================================ */
#tsidebar {
	flex: 0 0 230px;
	min-width: 180px;
	max-width: 250px;
	background-color: var(--bg-sidebar);
	border-radius: var(--radius-md);
	padding: 20px 16px;
	border: 1px solid var(--border-light);
	display: inline-block;
	vertical-align: top;
}

.tsidesection {
	border-bottom: 1px solid var(--border-light);
	padding-bottom: 18px;
	margin-bottom: 18px;
}

.tsidesection:last-child {
	border-bottom: none;
	padding-bottom: 0;
	margin-bottom: 0;
}

#tsidebar h3 {
	margin: 0 0 10px;
	text-transform: uppercase;
	font-size: 9pt;
	letter-spacing: 1.4px;
	color: var(--primary);
	font-weight: 700;
	border-bottom: 2px solid var(--accent);
	padding-bottom: 6px;
}

/* Sidebar menu links */
.vmenu {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

.vmenu li {
	padding: 3px 0;
	font-size: 11pt;
	font-family: 'Quicksand', sans-serif;
}

.vmenu li a {
	display: block;
	color: var(--primary);
	text-decoration: none;
	padding: 5px 6px 5px 8px;
	border-left: 3px solid transparent;
	border-radius: 0 4px 4px 0;
	transition: color var(--transition), padding-left var(--transition),
	            border-color var(--transition), background-color var(--transition);
}

.vmenu li a:hover {
	color: var(--primary-dark);
	background-color: var(--accent-light);
	border-left: 3px solid var(--accent);
	padding-left: 12px;
	text-decoration: none;
}

/* ============================================================
   MAIN CONTENT AREA
   ============================================================ */
#thomebody {
	flex: 1;
	min-width: 0;
	display: inline-block;
	width: 100%;
}

#thomebody h2 {
	font-size: 16pt;
	color: var(--primary);
}

/* ============================================================
   CONTENT CARDS — .tblock
   ============================================================ */
.tblock {
	background-color: var(--bg-card);
	border: 1px solid var(--border-light);
	padding: 24px 26px;
	margin-bottom: 22px;
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-sm);
	transition: box-shadow var(--transition), transform var(--transition);
}

.tblock:hover {
	box-shadow: var(--shadow-md);
	transform: translateY(-1px);
}

.tblock h2 {
	margin: 0 0 14px;
	font-size: 15pt;
	color: var(--primary);
	border-bottom: 2px solid var(--border-mid);
	padding-bottom: 10px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px;
}

.tblock h2 a {
	font-size: 10pt;
	font-family: 'Quicksand', sans-serif;
	font-weight: 600;
	color: var(--accent);
	text-decoration: none;
	padding: 3px 10px;
	border: 1px solid var(--accent);
	border-radius: 20px;
	transition: background-color var(--transition), color var(--transition);
}

.tblock h2 a:hover {
	background-color: var(--accent);
	color: #ffffff;
	text-decoration: none;
}

.inner-block {
	background-color: #fafafa;
	margin-bottom: 12px;
	padding: 12px 14px;
	border-radius: var(--radius-sm);
	box-shadow: 0 1px 4px rgba(0,0,0,0.07);
}

/* ============================================================
   MAIN PHOTO
   ============================================================ */
#mainphoto {
	margin: 0 0 18px 22px;
	float: right;
}

#mainphoto img {
	max-width: 360px;
	width: 100%;
	border-radius: var(--radius-sm);
	box-shadow: var(--shadow-md);
}

#big-block-1 img {
	border-radius: var(--radius-sm);
	box-shadow: var(--shadow-md);
}

/* ============================================================
   CONTENT TEXT
   ============================================================ */
.mainsection p {
	margin: 0 0 12px;
	font-size: 1rem;
	line-height: 1.7em;
	color: var(--text-main);
}

.tablediv {
	display: table-cell;
	width: 49%;
	font-size: 12pt;
}

/* ============================================================
   SEARCH FORM
   ============================================================ */
#search-submit {
	margin-top: 6px;
	margin-bottom: 6px;
}

/* ============================================================
   MISC ELEMENTS
   ============================================================ */
.emailimg {
	width: 40px;
	height: 26px;
	margin: 0 8px 0 0;
	float: left;
	border: 0;
}

.indexpage {
	text-align: left;
}

.LB_window {
	border: 2px solid #000000;
	color: #000000;
}

.titlebox {
	background-color: #f6f6f6;
}

.top-rounded-headline {
	padding: 15px 15px 0 20px;
}

.searchsidebar {
	margin-right: 0;
}

/* ============================================================
   MISC TNG
   ============================================================ */
.databackalt {
	background-color: #D9D9D9;
}

/* ============================================================
   SURNAME CLOUD
   ============================================================ */
.surnames-cloud, .surnames-cloud a {
	text-align: left;
}

a.size1      { color: #000099; }
a.size1:link    { color: #000099; }
a.size1:visited { color: #000099; }
a.size2      { color: #3333CC; }
a.size2:link    { color: #3333CC; }
a.size2:visited { color: #3333CC; }
a.size3      { color: #006633; }
a.size3:link    { color: #006633; }
a.size3:visited { color: #006633; }
a.size4      { color: #993300; }
a.size4:link    { color: #993300; }
a.size4:visited { color: #993300; }
a.size5      { color: #CC0033; }
a.size5:link    { color: #CC0033; }
a.size5:visited { color: #CC0033; }
a.size6      { color: #666666; }
a.size6:link    { color: #666666; }
a.size6:visited { color: #666666; }
a.size7      { color: #CC9900; }
a.size7:link    { color: #CC9900; }
a.size7:visited { color: #CC9900; }
a.size8      { color: #999933; }
a.size8:link    { color: #999933; }
a.size8:visited { color: #999933; }
a.size9      { color: #000000; }
a.size9:link    { color: #000000; }
a.size9:visited { color: #000000; }
a.size0      { color: #000000; }
a.size0:link    { color: #000000; }
a.size0:visited { color: #000000; }

/* ============================================================
   FOOTER — Modern Dark Three-Column Footer
   ============================================================ */
#tfooter {
	background: var(--primary);
	color: rgba(255,255,255,0.80);
	border-radius: 0;
	padding: 0;
	margin-top: 8px;
	font-size: 10.5pt;
}

/* Three-column top section */
#tfooter-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 32px;
	padding: 36px 36px 28px;
	border-bottom: 1px solid rgba(255,255,255,0.10);
}

/* Brand / Logo column */
.tfooter-brand {
	flex: 1 1 180px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
}

.tfooter-logo {
	height: 150px;
	width: auto;
	object-fit: contain;

}

.tfooter-sitename {
	font-family: 'Rochester', cursive;
	font-size: 18pt;
	color: #ffffff;
	line-height: 1.2;
	letter-spacing: 0.5px;
	display: none;
}

/* Navigation links column */
.tfooter-nav {
	flex: 1 1 200px;
}

.tfooter-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.tfooter-nav ul li a {
	color: rgba(255,255,255,0.78);
	text-decoration: none;
	font-size: 10.5pt;
	font-family: 'Quicksand', sans-serif;
	transition: color var(--transition), padding-left var(--transition);
	display: inline-block;
	padding-left: 0;
	border-left: 2px solid transparent;
}

.tfooter-nav ul li a:hover {
	color: var(--accent-light);
	padding-left: 6px;
	border-left: 2px solid var(--accent);
	text-decoration: none;
}

/* Contact column */
.tfooter-contact {
	flex: 1 1 200px;
}

.tfooter-contact h4 {
	color: #ffffff;
	font-family: 'Quicksand', sans-serif;
	font-size: 10pt;
	text-transform: uppercase;
	letter-spacing: 1.4px;
	margin: 0 0 10px;
	padding-bottom: 6px;
	border-bottom: 2px solid var(--accent);
	display: inline-block;
}

.tfooter-contact p {
	color: rgba(255,255,255,0.72);
	font-size: 10pt;
	line-height: 1.65;
	margin: 0;
}

.tfooter-contact a {
	color: #ffffff;
	text-decoration: none;
	transition: color var(--transition);
}

.tfooter-contact a:hover {
	color: var(--accent-light);
	text-decoration: underline;
}

/* Bottom bar */
#tfooter-bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 14px 36px 18px;
}

#tfooter-legal {
	color: rgba(255,255,255,0.55);
	font-size: 9.5pt;
}

#tfooter-legal a {
	color: rgba(255,255,255,0.55);
	text-decoration: none;
	transition: color var(--transition);
}

#tfooter-legal a:hover {
	color: var(--accent-light);
	text-decoration: none;
}

/* Terms / Privacy / Contact links */
#tfooter-links {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

#tfooter-links a {
	color: var(--accent-light);
	text-decoration: none;
	font-size: 9.5pt;
	font-family: 'Quicksand', sans-serif;
	font-weight: 600;
	transition: color var(--transition);
}

#tfooter-links a:hover {
	color: #ffffff;
	text-decoration: underline;
}

.tfooter-sep {
	color: rgba(255,255,255,0.30);
	font-size: 10pt;
}

/* ============================================================
   RESPONSIVE — WIDE (max-width: 1280px)
   ============================================================ */
@media (max-width: 1280px) {
	#tpage {
		width: 92%;
	}

	.searchsidebar {
		position: unset;
	}
}

/* ============================================================
   RESPONSIVE — TABLET LANDSCAPE (max-width: 1024px)
   ============================================================ */
@media (max-width: 1024px) {
	#tpage {
		width: 96%;
	}

	#thomemast h1,
	#tmast h1 {
		font-size: 28pt;
	}

	#t16-logo {
		height: 54px;
	}

	#tbody {
		padding: 22px;
		gap: 20px;
	}

	#tsidebar {
		flex: 0 0 200px;
		min-width: 160px;
	}

	#tfooter-inner {
		padding: 28px 28px 22px;
		gap: 24px;
	}

	#tfooter-bottom {
		padding: 12px 28px 16px;
	}
}

/* ============================================================
   RESPONSIVE — TABLET PORTRAIT (max-width: 870px)
   ============================================================ */
@media (max-width: 870px) {
	#tbody {
		flex-direction: column;
		padding: 18px;
		gap: 18px;
	}

	#tsidebar {
		flex: none;
		width: 100%;
		max-width: 100%;
		min-width: unset;
		display: block;
	}

	#thomebody {
		width: 100%;
		display: block;
	}

	.tablediv {
		display: block;
		width: 100%;
		font-size: 11pt;
	}

	#tmenu {
		padding: 0 16px;
	}

	#tmenu ul li a {
		padding: 11px 14px;
		font-size: 10.5pt;
	}

	#thomemast,
	#tmast {
		padding: 18px 22px 12px;
		gap: 14px;
		        
	}

	#thomemast h1,
	#tmast h1 {
		font-size: 24pt;
	}

	#t16-logo {
		height: 48px;
	}

	#tfooter-inner {
		padding: 24px 20px 18px;
		gap: 20px;
	}

	.tfooter-brand,
	.tfooter-nav,
	.tfooter-contact {
		flex: 1 1 100%;
	}

	#tfooter-bottom {
		padding: 12px 20px 16px;
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
	}

	/* Icons bar — compact on tablet */
	div.innercontainer {
		padding: 4px 12px;
		min-height: 38px;
	}

	ul.tngdd .menulink {
		padding: 6px 24px 6px 10px;
		font-size: 10pt;
	}

	div.icons a,
	div.icons-rt.in-bar a {
		padding: 5px 6px;
		font-size: 10pt;
	}
}

/* ============================================================
   RESPONSIVE — MOBILE (max-width: 600px)
   ============================================================ */
@media (max-width: 600px) {
	#tcontainer {
		padding: 0;
	}

	#tpage {
		width: 100%;
		border-radius: 0;
		box-shadow: none;
		margin: 0;
	}

	#tmastheader,
	.theader {
		border-radius: 0;
	}

	#thomemast,
	#tmast {
		flex-direction: column;
		align-items: flex-start;
		padding: 16px 18px 10px;
		gap: 6px;
	}

	#t16-logo {
		height: 40px;
	}

	#thomemast h1,
	#tmast h1 {
		font-size: 20pt;
		letter-spacing: 0.5px;
	}

	#tmenu {
		padding: 0 8px;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	#tmenu::-webkit-scrollbar {
		display: none;
	}

	#tmenu ul {
		flex-wrap: nowrap;
		white-space: nowrap;
	}

	#tmenu ul li a {
		padding: 10px 12px;
		font-size: 10pt;
	}

	#tbody {
		padding: 12px;
		gap: 14px;
	}

	.tblock {
		padding: 16px 14px;
		border-radius: var(--radius-sm);
	}

	.tblock h2 {
		font-size: 13pt;
	}

	#mainphoto {
		float: none;
		margin: 0 0 16px 0;
	}

	#mainphoto img {
		max-width: 100%;
		width: 100%;
	}

	.mainsection p {
		font-size: 11pt;
		line-height: 1.5em;
	}

	.std-only {
		display: none;
	}

	#tfooter {
		border-radius: 0;
	}

	#tfooter-inner {
		padding: 20px 16px 16px;
		gap: 18px;
	}

	.tfooter-logo {
		height: 38px;
	}

	.tfooter-sitename {
		font-size: 15pt;
	}

	.tfooter-nav ul {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 4px 14px;
	}

	.tfooter-nav ul li a {
		font-size: 10pt;
		border-left: none;
		padding-left: 0;
	}

	.tfooter-nav ul li a:hover {
		padding-left: 0;
		border-left: none;
		color: var(--accent-light);
	}

	#tfooter-bottom {
		padding: 10px 16px 14px;
		flex-direction: column;
		align-items: center;
		gap: 8px;
	}

	#tfooter-links {
		gap: 6px;
	}

	#tfooter-links a {
		font-size: 9pt;
	}

	/* Icons bar — horizontal scroll on mobile */
	div.menucontainer {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	div.innercontainer {
		flex-wrap: nowrap;
		padding: 4px 8px;
		min-height: 36px;
		gap: 2px;
	}

	ul.tngdd {
		flex-wrap: nowrap;
	}

	ul.tngdd .menulink {
		padding: 6px 20px 6px 8px;
		font-size: 9.5pt;
		white-space: nowrap;
	}

	div.icons a,
	div.icons-rt.in-bar a {
		padding: 4px 5px;
		font-size: 9.5pt;
	}

	#searchdrop.slidedown {
		padding: 12px 12px 10px;
	}

	#searchdrop input[type="text"] {
		width: 100%;
		max-width: 100%;
		display: block;
		margin-bottom: 6px;
	}
}

/* ============================================================
   RESPONSIVE — SMALL MOBILE (max-width: 400px)
   ============================================================ */
@media (max-width: 400px) {
	#thomemast h1,
	#tmast h1 {
		font-size: 17pt;
	}

	#t16-logo {
		height: 34px;
	}

	.tblock {
		padding: 12px 10px;
	}

	.vmenu li {
		font-size: 10pt;
	}

	#tfooter-inner {
		padding: 16px 12px 14px;
		gap: 14px;
	}

	.tfooter-sitename {
		font-size: 13pt;
	}

	#tfooter-bottom {
		padding: 8px 12px 12px;
	}

	#tfooter-links a,
	#tfooter-legal {
		font-size: 8.5pt;
	}
}

/* ============================================================
   CONTACT FORM — suggest.php (Contact Us mode)
   ============================================================ */

/* Honeypot — hide from humans */
.contact-hp {
	position: absolute;
	left: -9999px;
	opacity: 0;
	pointer-events: none;
}

/* ---- Banner messages ---- */
.contact-banner {
	padding: 13px 16px;
	border-radius: var(--radius-sm);
	margin-bottom: 20px;
	font-family: 'Quicksand', sans-serif;
	font-size: 11pt;
	font-weight: 600;
	line-height: 1.5;
}

.contact-banner--success {
	background: #ecfdf5;
	color: #065f46;
	border: 1px solid #a7f3d0;
}

.contact-banner--error {
	background: #fef2f2;
	color: #991b1b;
	border: 1px solid #fecaca;
}

/* ---- Card wrapper ---- */
.contact-card {
	background: var(--bg-card);
	border: 1px solid var(--border-light);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-md);
	overflow: hidden;
	margin-bottom: 28px;
}

/* ---- Card header strip ---- */
.contact-card__header {
	background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 100%);
	padding: 28px 32px;
	display: flex;
	align-items: flex-start;
	gap: 18px;
}

.contact-card__icon {
	font-size: 32pt;
	line-height: 1;
	flex-shrink: 0;
}

.contact-card__header h2 {
	color: #ffffff !important;
	font-family: 'Quicksand', sans-serif;
	font-size: 17pt;
	font-weight: 700;
	margin: 0 0 6px;
	border: none !important;
	padding: 0 !important;
	display: block !important;
}

.contact-card__header p {
	color: rgba(255,255,255,0.78);
	font-size: 11pt;
	margin: 0;
	line-height: 1.6;
}

/* ---- Form area ---- */
.contact-card form {
	padding: 28px 32px;
	display: flex;
	flex-direction: column;
	gap: 18px;
}

/* ---- Two-column grid ---- */
.contact-grid {
	display: grid;
	gap: 16px;
}

.contact-grid--2 {
	grid-template-columns: 1fr 1fr;
}

/* ---- Individual field wrapper ---- */
.contact-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.contact-field > label {
	font-family: 'Quicksand', sans-serif;
	font-size: 10pt;
	font-weight: 700;
	color: var(--text-main);
	letter-spacing: 0.3px;
}

.contact-req {
	color: var(--primary);
	margin-left: 3px;
}

/* ---- Inputs / select / textarea ---- */
.contact-card input[type="text"],
.contact-card input[type="email"],
.contact-card input[type="file"],
.contact-card select,
.contact-card textarea {
	width: 100%;
	border: 1px solid var(--border-mid);
	border-radius: var(--radius-sm);
	padding: 11px 14px;
	font-family: 'Quicksand', sans-serif;
	font-size: 11pt;
	color: var(--text-main);
	background: #ffffff;
	
	transition: border-color var(--transition), box-shadow var(--transition);
	appearance: auto;
}

.contact-card input[type="text"]:focus,
.contact-card input[type="email"]:focus,
.contact-card select:focus,
.contact-card textarea:focus {
	outline: none;
	border-color: var(--accent);
	box-shadow: 0 0 0 3px rgba(91,188,214,0.22);
}

.contact-card textarea {
	min-height: 140px;
	resize: vertical;
	line-height: 1.6;
}

.contact-card input[type="file"] {
	padding: 8px 10px;
	cursor: pointer;
	color: var(--text-muted);
}

/* ---- Pre-filled subject display ---- */
.contact-prefilled {
	background: var(--bg-sidebar);
	border: 1px solid var(--border-light);
	border-radius: var(--radius-sm);
	padding: 10px 14px;
	font-size: 11pt;
	color: var(--text-muted);
	font-family: 'Quicksand', sans-serif;
}

/* ---- Hint text below fields ---- */
.contact-hint {
	color: var(--text-muted);
	font-size: 10pt;
	font-family: 'Quicksand', sans-serif;
	margin: 2px 0 0;
	line-height: 1.5;
}

/* ---- Checkbox rows ---- */
.contact-checkbox {
	display: flex;
	gap: 10px;
	align-items: flex-start;
}

.contact-checkbox input[type="checkbox"] {
	margin-top: 3px;
	accent-color: var(--primary);
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	cursor: pointer;
}

.contact-checkbox label {
	font-family: 'Quicksand', sans-serif;
	font-size: 11pt;
	color: var(--text-main);
	line-height: 1.6;
	cursor: pointer;
	font-weight: 400;
}

.contact-checkbox label a {
	color: var(--primary);
	text-decoration: none;
	font-weight: 700;
	border-bottom: 1px solid var(--accent);
	transition: color var(--transition), border-color var(--transition);
}

.contact-checkbox label a:hover {
	color: var(--accent);
	border-bottom-color: transparent;
}

/* ---- Submit button row ---- */
.contact-actions {
	display: flex;
	gap: 14px;
	align-items: center;
	flex-wrap: wrap;
}

.contact-btn,.btn_primary {
	appearance: none;
	-webkit-appearance: none;
	border: none;
	background: var(--primary);
	color: #ffffff!important;
	text-decoration: none!important;
	font-family: 'Quicksand', sans-serif;
	font-size: 11pt;
	font-weight: 700;
	padding: 12px 30px;
	border-radius: var(--radius-sm);
	cursor: pointer;
	letter-spacing: 0.3px;
	transition: background-color var(--transition), transform var(--transition), box-shadow var(--transition);
	box-shadow: var(--shadow-sm);
	    display: flex;
    align-items: center;
}

.btn_primary{
    background-color: var(--accent);
    border-radius: 0;
}

.left{
    margin-left: auto;
}

.contact-btn:hover {
	background-color: var(--primary-mid);
	transform: translateY(-1px);
	box-shadow: var(--shadow-md);
}
.btn_primary:hover{
    background-color: var(--primary);
}

.contact-btn:active {
	transform: translateY(0);
	box-shadow: none;
}

/* ---- Privacy note box ---- */
.contact-note {
	background: var(--bg-sidebar);
	border: 1px solid var(--border-light);
	border-left: 4px solid var(--accent);
	padding: 12px 16px;
	border-radius: var(--radius-sm);
	color: var(--text-muted);
	font-family: 'Quicksand', sans-serif;
	font-size: 10.5pt;
	line-height: 1.6;
}

.contact-note strong {
	color: var(--primary);
}

/* ---- Card footer ---- */
.contact-card__footer {
	padding: 16px 32px 20px;
	border-top: 1px solid var(--border-light);
	background: var(--bg-sidebar);
	color: var(--text-muted);
	font-family: 'Quicksand', sans-serif;
	font-size: 10.5pt;
}

.contact-card__footer a {
	color: var(--primary);
	font-weight: 700;
	text-decoration: none;
	border-bottom: 1px solid var(--accent);
	transition: color var(--transition), border-color var(--transition);
}

.contact-card__footer a:hover {
	color: var(--accent);
	border-bottom-color: transparent;
}

/* ============================================================
   RESPONSIVE — TABLET (max-width: 870px)
   ============================================================ */
@media (max-width: 870px) {
	.contact-grid--2 {
		grid-template-columns: 1fr;
	}

	.contact-card__header {
		padding: 24px 24px;
	}

	.contact-card form {
		padding: 24px 24px;
		gap: 16px;
	}

	.contact-card__footer {
		padding: 14px 24px 18px;
	}
}

/* ============================================================
   RESPONSIVE — MOBILE (max-width: 600px)
   ============================================================ */
@media (max-width: 600px) {
	.contact-card {
		border-radius: var(--radius-sm);
	}

	.contact-card__header {
		flex-direction: column;
		gap: 10px;
		padding: 20px 16px;
	}

	.contact-card__icon {
		font-size: 26pt;
	}

	.contact-card__header h2 {
		font-size: 14pt !important;
	}

	.contact-card__header p {
		font-size: 10.5pt;
	}

	.contact-card form {
		padding: 18px 16px;
		gap: 14px;
	}

    
	.contact-card input[type="text"],
	.contact-card input[type="email"],
	.contact-card select,
	.contact-card textarea {
		font-size: 10.5pt;
		padding: 10px 12px;
	}

	.contact-actions {
		flex-direction: column;
		align-items: stretch;
		gap: 10px;
	}

	.contact-btn {
		width: 100%;
		text-align: center;
		padding: 13px;
		font-size: 11pt;
	}

	.contact-card__footer {
		padding: 14px 16px 16px;
		font-size: 10pt;
	}

	.contact-banner {
		margin-bottom: 14px;
		font-size: 10.5pt;
	}
}

/* ============================================================
   RESPONSIVE — SMALL MOBILE (max-width: 400px)
   ============================================================ */
@media (max-width: 400px) {
	.contact-card__header h2 {
		font-size: 13pt !important;
	}

	.contact-card form {
		padding: 14px 12px;
		gap: 12px;
	}

	.contact-btn {
		padding: 12px;
		font-size: 10.5pt;
	}

	.contact-checkbox label {
		font-size: 10.5pt;
	}
}

.contact-card .emphasis a{
    color: #fff;
}

/* Password field wrapper — holds input + eye icon together */
.login-input-wrap {
	position: relative;
	display: flex;
	align-items: center;
}

.login-input-wrap input[type="password"],
.login-input-wrap input[type="text"] {
	width: 100%;
	padding-right: 44px; /* room for eye icon */
	border: 1px solid var(--border-mid);
	border-radius: var(--radius-sm);
	padding-top: 11px;
	padding-bottom: 11px;
	padding-left: 14px;
	font-family: 'Quicksand', sans-serif;
	font-size: 11pt;
	color: var(--text-main);
	background: #ffffff;
	
	transition: border-color var(--transition), box-shadow var(--transition);
}

.login-input-wrap input:focus {
	outline: none;
	border-color: var(--accent);
	box-shadow: 0 0 0 3px rgba(91,188,214,0.22);
}

/* Eye toggle icon */
.login-pwd-toggle {
	position: absolute;
	right: 12px;
	width: 22px;
	height: 22px;
	cursor: pointer;
	opacity: 0.45;
	transition: opacity var(--transition);
	flex-shrink: 0;
}

.login-pwd-toggle:hover {
	opacity: 0.85;
}

/* Remember me / Reset password checkboxes */
.login-options {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.login-check-label {
	display: flex;
	align-items: center;
	gap: 8px;
	font-family: 'Quicksand', sans-serif;
	font-size: 11pt;
	color: var(--text-main);
	cursor: pointer;
}

.login-check-label input[type="checkbox"] {
	accent-color: var(--primary);
	width: 16px;
	height: 16px;
	cursor: pointer;
	flex-shrink: 0;
}

/* Submit button row */
.login-card .contact-actions {
	margin-top: 4px;
}

.login-card .contact-btn,
.login-card input[type="submit"].contact-btn {
	width: 100%;
	text-align: center;
	padding: 13px;
	font-size: 11.5pt;
	border-radius: var(--radius-sm);
	border: none;
	cursor: pointer;
	max-width: 200px;
	background: var(--primary);
	transition: all .3s ease;
}

.login-card .contact-btn:hover,
.login-card input[type="submit"].contact-btn:hover{
    opacity: .7;
    color: #fff;
}

/* Register link strip */
.login-register {
	padding: 14px 32px 18px;
	border-top: 1px solid var(--border-light);
	background: var(--bg-sidebar);
	font-family: 'Quicksand', sans-serif;
	font-size: 10.5pt;
	color: var(--text-muted);
	text-align: center;
}

.login-register a {
	color: var(--primary);
	font-weight: 700;
	text-decoration: none;
	border-bottom: 1px solid var(--accent);
	transition: color var(--transition), border-color var(--transition);
}

.login-register a:hover {
	color: var(--accent);
	border-bottom-color: transparent;
}

/* ---- Forgot password card ---- */
.login-forgot-card {
	margin-top: 20px;
}

/* Slightly softer header for the forgot card */
.login-forgot-header {
	background: linear-gradient(135deg, var(--primary) 0%, var(--primary-mid) 100%) !important;
}

.login-forgot-body {
	padding: 24px 32px 28px;
	display: flex;
	flex-direction: column;
	gap: 0;
}

.login-forgot-row {
	padding: 16px 0;
}

.login-forgot-label {
	font-family: 'Quicksand', sans-serif;
	font-size: 11pt;
	color: var(--text-main);
	margin: 0 0 10px;
	line-height: 1.5;
}

/* Email / username + Go button on one row */
.login-forgot-input-row {
	display: flex;
	gap: 10px;
	align-items: center;
}

.login-forgot-input-row input[type="text"] {
	flex: 1;
	border: 1px solid var(--border-mid);
	border-radius: var(--radius-sm);
	padding: 10px 14px;
	font-family: 'Quicksand', sans-serif;
	font-size: 11pt;
	color: var(--text-main);
	background: #ffffff;
	box-sizing: border-box;
	transition: border-color var(--transition), box-shadow var(--transition);
}

.login-forgot-input-row input[type="text"]:focus {
	outline: none;
	border-color: var(--accent);
	box-shadow: 0 0 0 3px rgba(91,188,214,0.22);
}

.login-forgot-btn {
	flex-shrink: 0;
	padding: 10px 22px !important;
	font-size: 10.5pt !important;
	white-space: nowrap;
}

/* Feedback messages (AJAX responses) */
.login-feedback {
	margin-top: 8px;
	font-family: 'Quicksand', sans-serif;
	font-size: 10.5pt;
	color: var(--text-muted);
	min-height: 20px;
}

/* OR divider between the two forgot rows */
.login-divider {
	display: flex;
	align-items: center;
	gap: 12px;
	color: var(--text-light);
	font-size: 10pt;
	font-family: 'Quicksand', sans-serif;
	padding: 4px 0;
}

.login-divider::before,
.login-divider::after {
	content: '';
	flex: 1;
	height: 1px;
	background: var(--border-light);
}

.login-divider span {
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
	color: var(--text-light);
}

/* ============================================================
   RESPONSIVE — MOBILE (max-width: 600px)
   ============================================================ */
@media (max-width: 600px) {
	.login-card {
		max-width: 100%;
	}

	.login-card form,
	.login-forgot-body {
		padding: 18px 16px;
		gap: 14px;
	}

	.login-forgot-input-row {
		flex-direction: column;
		align-items: stretch;
	}

	.login-forgot-btn {
		width: 100%;
		text-align: center;
	}

	.login-register {
		padding: 14px 16px 16px;
	}

	.login-forgot-body {
		padding-bottom: 20px;
	}
}

/* ============================================================
   RESPONSIVE — SMALL MOBILE (max-width: 400px)
   ============================================================ */
@media (max-width: 400px) {
	.login-card form {
		padding: 14px 12px;
	}

	.login-forgot-body {
		padding: 14px 12px 18px;
	}

	.login-check-label {
		font-size: 10.5pt;
	}
}

/* ============================================================
   REGISTER PAGE — newacctform.php
   Extends .contact-card / .login-card base styles
   ============================================================ */

/* Wider than login card — registration has more fields */
.register-card {
	max-width: 780px;
}

/* Required note line */
.register-required-note {
	margin: 0 0 4px;
	padding: 0 32px;
}

/* Section title dividers */
.register-section-title {
	font-family: 'Quicksand', sans-serif;
	font-size: 9pt;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1.4px;
	color: var(--primary);
	border-bottom: 2px solid var(--accent);
	padding-bottom: 6px;
	margin-bottom: 2px;
	display: flex;
	align-items: center;
	gap: 8px;
}

/* Collapsible address section toggle */
.register-section-toggle {
	cursor: pointer;
	user-select: none;
	transition: color var(--transition);
}

.register-section-toggle:hover {
	color: var(--primary-mid);
}

.register-toggle-icon {
	font-size: 13pt;
	line-height: 1;
	color: var(--accent);
	margin-left: auto;
}

.register-section-optional {
	font-size: 8.5pt;
	color: var(--text-light);
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
}

/* Collapsible address block */
#register-address {
	border-left: 3px solid var(--border-mid);
	padding-left: 16px;
	margin-top: 12px;
	display: flex;
	flex-direction: column;
	gap: 0;
}

/* Form padding for register card */
.register-card form {
	padding: 24px 32px 28px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* ============================================================
   RESPONSIVE — TABLET (max-width: 870px)
   ============================================================ */
@media (max-width: 870px) {
	.register-card {
		max-width: 100%;
	}

	.register-card form {
		padding: 22px 22px 24px;
		gap: 16px;
	}

	.register-required-note {
		padding: 0 22px;
	}
}

/* ============================================================
   RESPONSIVE — MOBILE (max-width: 600px)
   ============================================================ */
@media (max-width: 600px) {
	.register-card form {
		padding: 16px 14px 20px;
		gap: 14px;
	}

	.register-required-note {
		padding: 0 14px;
	}

	.register-section-title {
		font-size: 8.5pt;
	}

	#register-address {
		padding-left: 10px;
	}
}

/* ============================================================
   RESPONSIVE — SMALL MOBILE (max-width: 400px)
   ============================================================ */
@media (max-width: 400px) {
	.register-card form {
		padding: 12px 10px 16px;
	}
}